Generate Header Issues (post 2.0 upgrade)

Community Forums Forums Design Tips and Tricks Generate Header Issues (post 2.0 upgrade)

This topic is: not resolved

This topic contains 11 replies, has 2 voices, and was last updated by  braddalton 2 years, 3 months ago.

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
  • #55650



    I’m not a coding whizz – but with ok instructions I can usually succeed!

    I use the Generate theme at
    Pre-upgrade I was using the Genesis Simple Headers plugin to load a 150 pixel high, full width header image.
    With a widget’ed banner sitting above it.
    And to stop the header text appearing I had emptied those fields in “general settings”.

    As soon as I upgraded I had the header image appearing twice.
    Tried various things, with the following results:
    – header perfect, BUT sitting far left of screen, not over the website
    – header in a space above the header bar
    – header in the right space, but the header space not allowing the header to show through (grey bar along the bottom)

    Could someone please let me know what code I need to put into the css sheet so I can get a full width 150 pixel high header image to show in the right place, without any text on top of it, and with a widget banner?

    Thanks in advance


    Do you want the header image where the title is and the banner in the header right widget?

    Like this:

    new header image sizes



    Hi Brad,

    Your link’s not working. But I want an image 150 pixels high filling the header space, with a banner in the header right widget.




    Link works fine for me.

    What modifications have you made to any of the code?

    The 2 tutorials i have written result in what you can see in the above screenshot. Is that exactly what you want?



    Hi Brad,

    When I click the link it’s starting with an ip address – and isn’t working


    As far as I’m aware I’ve made no modifications to the code – try to avoid doing that as much as possible!
    I like the simple life!!





    Sweet! Thanks Brad – will give that a go!



    Hi Brad / All,

    Have tried to follow the tutorial – BUT the code doesn’t match that of the generate theme. So I’m stumbling.

    Got to here:

    which leaves me with 2 issues:
    1. header aligned to the far left
    2. widget in a whole area below the rest of the header.

    This will be live on the site for a bit whilst I try and find another solution – but if anyone has any suggestions that would be greatly appreciated.





    Further progress.

    I’ve now got to this:

    – header image in the right place
    – text over it that I’d like to remove
    – widget in the wrong place and blocking some the header

    (right now I’m going to turn off the widget and delete the text in General settings so that I can leave my site looking ok)

    BUT that’s a very temporary solution
    – I still want to know how to remove the text
    – I still want to know how to get the widget in the right place

    FYI the way I’ve got the header to show is using the following:

    #title-area {
    background: url(;
    padding: 20px 0 0;
    height: 120px;
    width: 450px; /* 450px / 960px */

    No idea if that’s good / bad / horrendous. But that’s what I’ve done.

    Thanks in advance for any help!



    Do you want your header right widget aligned with your logo image?

    What are you going to put in the header right widget?

    To remove the text, simply remove it from the general settings and the setting on the Custom Header page.



    I want my right header widget to appear where you’d expect it to appear.
    I will be putting a promotional banner in it.

    If anyone from Genesis read these – really pleased to see that the latest Genesis update doesn’t fit the problems with the Generate header either.



    The best way to add a header image in the Generate theme is to upload it to the images folder and make sure its:

    1. .png file format
    2. named logo

    This way it replaces the default logo which is already included in your theme and also includes CSS to position it correctly.

    You will then need to modify the CSS code in your style sheet and change the height values from 100px to 150px.

    If you also want to add an image to the header right widget you will also need to change the height value to match which in your case is 150px.

    You cannot use a header image which is 960px in width and also add a image to the right widget so you will need to crop your logo to about 560px width and then upload it to your images folder in your child theme.

    I wouldn’t add it to your CSS as you have done as the CSS for a default logo is already included in your style sheet.

    You can then add the HTML for your header right widget image which should be about 340px width and 150px height.

    If you want to use a full width header, you will need to change the values for the width as well.

    Here’s the full tutorial i published on this today.

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.