• paulajo58

    (@paulajo58)


    Hi. This is my first time here so I hope I am posting correctly!

    I have created a child theme for my parent theme, Clava (themeforest). I created a new child style.css and used the @import function to load the parent theme style.css first as I have learned from the codex here and other videos on child themes. I have activated my child theme but for some reason I am not seeing the styles in my child theme style.css on my site. I have gone to the editor in my dashboard and I see the child theme style.css so I just can’t figure out what I am doing wrong. I am sure it is something small I am doing/not doing. Could someone help me? Thanks in advance!

    I could provide some screenshots of my child theme style.css if necessary! I wasn’t sure if I could add a photo to the post.

    My site is: http://www.annikathedoula.com
    Please keep in mind this site is a work in progress and normally there is an Ultimate Coming Soon plugin activated until we are ready to go live. But I have deactivated this plugin so you folks could go there to see it.

    Paula Jo Nyman

Viewing 8 replies - 1 through 8 (of 8 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Could you point out a specific style that’s not working? As far as I can see your Child Theme is working fine.

    Thread Starter paulajo58

    (@paulajo58)

    Hi Andrew! Yes, I can. Here is one specific style:

    .promo_content h3 {
        color: #009999;
        font-size: 28px;
        font-family: 'Gilda Display', serif;
    }

    This is the style of the heading 3 in the promo box just under the slider on the home page. The text should be a teal color and the font should be a google font called Gilda Display.

    And in the footer, these are the styles I want:

    .footer {
    	background: #caae96;
    }
    .footer_bottom{
    	background: #e85f18;
    	color:#fffdf6;
    }
    .copyright {
        color: #313131;
        font-family: 'Droid Sans', sans-serif;
    }
    .copyright a{
    	color:#fffdf6;
    }
    .copyright a:hover{
    	color:#e85f18;
    }

    These are not showing either.

    Is there a special callout for Google fonts? I think there is…where should that go? Because none of my fonts are coming out.

    Does that help?
    Paula Jo

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    It looks like your theme pulls in a load of stylesheets after your Child Theme style.css file has loaded, which can mean your styles in your Child Theme get overridden.

    You could try using more specific selectors,
    E.g. instead of this:

    .promo_content h3

    Try this:

    body .promo_content h3

    Thread Starter paulajo58

    (@paulajo58)

    Hi again! I just put this command at the top of my child style.css:
    @import url(http://fonts.googleapis.com/css?family=Over+the+Rainbow);
    I got this command from google fonts.

    And then put this in my styles and it did not work!
    font-family: 'Over the Rainbow', cursive;
    It is still showing it as open sans font.

    Paula Jo

    Thread Starter paulajo58

    (@paulajo58)

    I will try that Andrew. Are there some stylesheets that I don’t need so that it won’t be overridden? Or do I list my stylesheets in a different order, would that help?
    Paula Jo

    Thread Starter paulajo58

    (@paulajo58)

    Okay, your suggestion worked Andrew! The color and font are there! I guess I just have to go over all my selectors? That will be a big job. It’s not that long a stylesheet but long enough. Would adding “body” work on a lot of them? Or just the parent selector above the selector I have?
    Paula Jo

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I think prepending “body” to them will work for the majority of cases, however you could address this with your theme’s vendors/ authors for a more sustainable solution.

    Thread Starter paulajo58

    (@paulajo58)

    Good idea…thanks so much Andrew! I REALLY appreciate your quick help!

    Paula Jo

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Child theme not reading style.css’ is closed to new replies.