12 JULY 2014 - UPDATE

1) We have just released Striking 5.3 maintenance update for those still using the "Original" Striking theme. Please see the theme release thread below for details. This update is only available by the internal update function as this theme is deprecated and no longer available for sale.

2)  Next inline in a few days is Striking MultiFlex. This update is actually "in the can" but we are working on ancillary matters. Expect it sometime in the next few days.

To insert code use <code>...</code>.
Child theme style.css not overriding parent
  • I may be mistaken but shouldn't something like:

    #feature {
    background-color: #696000;
    }

    in the child's style.css file override the parent's setting? Is there something else I have to do?

    I would appreciate any help/insight.

    Thanks
  • 10 Comments sorted by
  • Hi Elky,

    Why put this in css as you can set this by the color settings in striking itself? This does not make any sense.

    but if you want to overwrite it you could use the !important statement otherwise it wont work.


    #feature {
    background-color: #696000 !important;
    }

    Best regards,
    BackuPs
  • BackuPs is Right, us the !important statement. Like elky, i like to keep all the custom design separate from the theme when possible. I feel I have more control and its saved in the child theme.

    P.S. Have you made sure to pull in the parent themes style sheet into your child's style sheet using @import?

    I have come across on other themes, that sometimes the themes custom css settings do not always output to the file correctly. Try testing different things and using firebug.
  • Thanks for the input guys.

    BackuPs,
    I am using this in hopes to be able to give a client a dark and light theme. If I put the code in the child theme style.css I can have two child themes with different designs. Then all the client has to do is activate the theme (light/dark) that he wants that day/week/month without messing with the all the settings. Anyhow, I have most of the striking options hidden in his admin.

    Do you see a problem with that setup? Any other problems I may run into?

    Raven,
    I did have the @import statement, but not the !important statement.

    Do either one of you know if running multiple child themes on a wordpress multisite install cause conflicts?

    I'll give it a go and report back.
    Thanks again.
  • Just trying to learn about how this hangs together so can you answer a couple of dumb questions related to this thread:

    a) in this context what does "child" mean, if you say "child theme" is sounds as if there can be several themes per site and there is a hierarchy but I don't think that's true? So what is it a child of?
    b) where is the best place to understand the css related stuff - e.g. @import and !important do and how to use them?

    thanks
  • Hey lizat,
    I'm honestly new to the whole child theme thing (properly why I can't get it to work.) Instead of explaining it wrong here is a link to where I read about it. Its a good starting place for the basics.
    http://codex.wordpress.org/Child_Themes
    Regards.
  • I gave the suggestions above a go and it works. Client has two themes he can switch back and forth now.

    Only issue now is with multisite setup i'm playing with. I want to load an @fontface font from the child style.css but it only works from the main site (domain.com.) The sub-sites (site.domain.com) do not load the font. I'm assuming its a file link issue.

    Here is the childs style.css:

    /*
    Theme Name: Green
    Description: Child theme for the Striking theme
    Author: KaptinLin
    Author URI: http://themeforest.net/user/Kaptinlin
    Template: striking
    Version: 0.5.0
    */

    @import url("../striking/style.css");

    #feature.nivo .inner {
    padding: 39px 0 0;
    }

    #feature {
    background-color: #047D0C !important;
    }

    #footer {
    background-color: #047D0C !important;
    }

    body {margin:0 auto;background-color:#ccc;width:980px;}

    @font-face {
    font-family: "BlackJackRegular";
    font-style: normal;
    font-weight: normal;
    src: url("../striking/fontfaces/BlackJack-fontfacekit/black_jack-webfont.eot?iefix") format("eot"),
    url("../striking/fontfaces/BlackJack-fontfacekit/black_jack-webfont.woff") format("woff"),
    url("../striking/fontfaces/BlackJack-fontfacekit/black_jack-webfont.ttf") format("truetype"),
    url("../striking/fontfaces/BlackJack-fontfacekit/black_jack-webfont.svg#webfontecqheqea") format("svg");
    }

    #site_name {
    font-family:BlackJackRegular, sans-serif;
    font-size: 30px;
    line-height:40px;
    display:block;
    }

    All the color changes work on the sub-sites, just not the font.

    Anyone have any ideas?
  • @Elky,

    I am not completely sure, but my graphic designer has stated something to the same effect. I prefer to use fontface over cufon when building our client's sites so when asked why she uses the cufon on the sites we just worked on, she stated that the font face was not working very well on some elements it was not showing up. This may be the same issue or not but it is surely related. If it makes a difference we too are using multisite and child themes.
  • I did just read a comment in another thread that suggests to turn off cufon for fontface to work. Maybe give that a try, I will test it out later when i have a few moments.
  • Since the fontface worked on the main domain with the same child theme style.css code I didn't even think of turning off cufon. Put once I did the sub-sites worked.

    I wonder why it affects one and not the other.

    I had almost convinced myself it was an nginx subdomain issue. Glad to find out it wasn't.

    Thanks for your help.
  • Glad it worked, but I would Imagine that is a bug that needs to be fixed