Altering the blue header

  • Hi,

    I like this theme a lot! Great that you implement the theme option to change the color of the blue header.

    I′d like to do a bit more, like changing the height and maybe add some transparency. After going through php/css and WP′s option table, I have to admit I’m confused ??

    Can you please give some info on which elements need to be overwritten through my child-theme to address this?

Viewing 7 replies - 1 through 7 (of 7 total)

  • Hey there,

    You can change header’s height and add some transparency to it with the help of following custom CSS:-

    .header{
    height: 140px;
    -ms-filter:    "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);   */
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
     opacity: 0.5;
}

    You can add above code using Advanced CSS Editor, for the sake of simplicity. Adjust the opacity and height according to your needs. Hope it helps.

    Thread Starter Blamedutchie

    (@blamedutchie)

    That is a swift reply ??

    Will play with this, thanks!

    Hey there,

    Let us know how it goes ??

    Thread Starter Blamedutchie

    (@blamedutchie)

    Hi,

    Thanks for keeping the finger on the pulse ??

    Still confused… I′ve managed to alter the header. And then saw that what I really am trying to change the appearance of is the following:

    If you go to This Link you′ll see the large brown top of the screen in which the title of the page is shown. First I thought this was part of the header, but with the help of Firebug I thought that it appeared to be .cover-background. Changing any value for that element however does nothing, so it is some kind of overlay, right?

    I went through the php again and it is getting a bit clearer, but…

    What am I missing? Which element am I trying to change and where is it set?

    I am running the aesop engine also, could that it be that I should be looking there?

    Thanks!

    Hey there,

    Looks like you have some sort of copyright plugin activated on your site which is actually preventing me to use Chrome’s inspection tools. Please disable it and let us know and we’ll figure something out ?? Thanks!

    Thread Starter Blamedutchie

    (@blamedutchie)

    Oops, you′re right.

    Switched it off.
    Thanks!

    Hi there,

    You can achieve what you’re after with the help of following custom CSS: 

    .cover{
    background-color: #026cd2!important;
}

    You know the drill ??

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Altering the blue header’ is closed to new replies.