Need help? Check out our Support site, then

How to change header background color in Skylark Theme?

  1. Hi,

    I'm planning a custom CSS upgrade just for changing the background color of header area (Blue- in my case). I've tried to change through CSS preview first, but unsuccesful. I've also searched the whole stylesheet for commands like "color, background color, header".

    Is there anyway to make this change on Skylark Theme?

    Thanks in advance.

    The blog I need help with is

  2. Hey,

    I have the same question. I want to purchase the CSS upgrade, but only if I can change the blue head color to another one on CSS.

    Is that possible?

  3. You need to add this to your stylesheet, and adjust at will:

    .site-header {
        background: #FFFFFF;

    #FFFFFF is white, but then you can go from there.
    Good luck!

  4. Still not working for me.

    Here is what i made:

    And preview result:

    As you can see, a change for main-navigation background color works. But for the header?

  5. When I look at your css, I still see your .site-header set to this:

    .site-header {
        background: none repeat scroll 0 0 #4188D4;

    When I change your hex code to #ffffff, the entire header goes white. Try adding this:

    .site-header {
    background: none repeat scroll 0 0 #FFFFFF!important;
  6. Still the same result.

    Please notice that i can only preview the changes, saving is unabled without a custom CSS upgrade.

    Perhaps, it's a "non-editable" part of this theme?

    Thanks anyway.

  7. You would need the custom design upgrade to make this change, yes. I'm sorry I didn't notice you didn't already have it.

    If it is something that is editable as a standard part of the theme, you'll find it in Dashboard/Appearance/Design.

    Good luck!

  8. I tested the CSS zandyring first replied with using the preview option on Skylark, and it worked in my test:

    .site-header {
        background: red;

    I used "red" to make it stand out in a during testing.

    Can you make sure you are pasting it as a separate new paragraph all by itself? Let me know if it's still not working for you and I'll see what else I can figure out to help you.

  9. Can you make sure you are pasting it as a separate new paragraph all by itself?

    This was the main problem entire the time. I deleted all other commands in CSS stylesheet editor, including the default commands ( Introduction etc..). Now works fine both hexadecimal and predefined color names.

    zandyring, designsimply,
    I'm sorry for my inattention and thank you for your efort. Now, it's time to upgrade a CSS customization for me ;)


  10. No problem! Happy to help. :)

Topic Closed

This topic has been closed to new replies.

About this Topic