Support » Theme: Tempera » Problems with child theme

  • Resolved codde


    I’m using a child theme for some little modifications on the theme.
    Everything works fine but I want to use some transparency for the background.
    I’ve found the line where the background is set but I wasn’t able to modify this correctly.
    The function I used is: rbga(255,255,255,0,9)

    Hope you know what I mean and somebody could help me.

Viewing 15 replies - 1 through 15 (of 16 total)
  • Hi Codde,

    you have one comma too many. Try this:


    Hi Antonietta,

    thanks, you’re right, my fault (but only in the post, in the code it was correct 🙂 )
    My problem is how to bring in the function in my child theme.
    Do you ahve any experience with child themes?

    If you refer to the css above, you need to find the html elements you want to apply your styles to, and write the css rule in style.css in your child theme. If you’d like me to be more specific, I need a link to your web page. Have you already got a child theme? This Codex article is helpful if you need a tutorial on how to do so:

    Let me know if you solve the issue, or enter a link so I hopefully I can be of more assistance.

    Yes, I’m refering to some other css.
    I’m not sure whether I can put the transparency in the css.

    My productive site is here

    Yes, the transparency is CSS code, an alternative way of defining color rules in CSS. With firebug I’ve found that you’ve already applied the transparency for the main content in this code:

    #main {
        background-color: rgba(255, 255, 255, 0.8);

    What did you use to write the CSS rule, a custom CSS option or plugin? If you want to add it in the child theme, simply add it in style.css in your child theme. You can add it anywhere, and it’ll work, however, it’s preferable to add a section that has all the styles for the main content so it’d be easier to keep track of your styles. Also, make sure that the inline style that you have added is deleted because it takes precedence over the stylesheet.

    The line you’ve found is hard coded in the theme but not in the child theme. Because I don’t want to edit the template each time it has been updated I decided to use the child theme and only modify those things I want to make different.
    Currently there are only these settings in the only file “style.css”:

    #access {
      margin: 0px auto 0;
    #main {
      margin-top: 0px;
      // background-color: rgba(255, 255, 255, 0.9);

    Using a child theme is the recommended choice, I thought you were already using it and that your site was already using the child. The CSS looks good. The background rgba color rule will apply the transparency in the main area (obviously, you’ll remove the double slashes //). At the moment is a very low transparency. You can increase the value by decreasing the number 9 (ex.: .8, .6, etc.). Changes in the child override the parent’s code. Have you tried how it’s working? Is there anything else you need to modify? Is there any other area of the site where you want to apply different styles?

    I’ve already created a child theme with the modified css above.
    But the transparancy doesn’t work properly (of course I’ve tested this not commented out)

    Could you be more specific? It’s not being applied, it’s being applied to the wrong element? Is everything else working in the child theme?

    Sure, so from the beginning…
    I’ve got a copy of the site for testing.
    There I did the lastest update for my theme so the hardcoded changes was overwritten.
    Then I created a child theme with the css you’ll find above. the two changes for #access (margin) and #main (margin-top) are working but not the background-color.

    #access {
      margin: 0px auto 0; // working
    #main {
      margin-top: 0px; // working
      background-color: rgba(255, 255, 255, 0.9); // not working

    Maybe it will be easier to take a look but for this I have to register you on the site.

    Is your development copy accessible online? If it is, I could still tweak things with firebug.

    Yes, it is online available:
    If you need more access then reading let me know it.

    The problem is that the inline style is still being displayed and overrides the stylesheet. I wonder if it’s an option that’s been set via a plugin or an option panel, that can be deleted from the admin panel.

    I added !important at the end of the rule and seemed to work in firebug:

    #main {
      margin-top: 0px; // working
      background-color: rgba(255, 255, 255, 0.9)!important;

    See how it goes.

    Hi Codde, how did it go?

    Sorry, I wasn’t able to answer.
    I’ve testet what you wrote and I must say: YOU’RE RIGHT!
    I works now very fine 🙂
    Thanks a lot for your help and patience!

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘Problems with child theme’ is closed to new replies.