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 1 year ago.

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

    chloethomas
    Participant
    Post count: 6

    Hi,

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

    I use the Generate theme at eCommerceMasterPlan.com.
    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
    Chloe

    http://eCommercemasterplan.com
    #55668

    braddalton
    Participant
    Post count: 9375

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

    Like this:

    new header image sizes


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #55977

    chloethomas
    Participant
    Post count: 6

    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.

    C.

    #55978

    braddalton
    Participant
    Post count: 9375

    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?


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #55993

    chloethomas
    Participant
    Post count: 6

    Hi Brad,

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

    “127.0.0.1:4001/wordpress/wp-content/uploads/2013/07/new-header-image-sizes.png”

    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!!

    Chloe

    #55997

    braddalton
    Participant
    Post count: 9375

    Here’s the tutorial http://wpsites.net/web-design/customize-header-logo-banner-images-in-metro-theme/


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #56004

    chloethomas
    Participant
    Post count: 6

    Sweet! Thanks Brad – will give that a go!

    #56334

    chloethomas
    Participant
    Post count: 6

    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:

    https://www.dropbox.com/s/j4uzclt8cd98fj7/header%20nightmare%202%20140813.PNG

    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.

    Thanks
    Chloe

    #56341

    chloethomas
    Participant
    Post count: 6

    OK,

    Further progress.

    I’ve now got to this:

    https://www.dropbox.com/s/ty05toehfj6z3jm/header%20nightmare%203.PNG

    So,
    - 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(http://ecommercemasterplan.com/wp-content/uploads/2012/10/ECMP-Header.png);
    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!
    Chloe

    #56359

    braddalton
    Participant
    Post count: 9375

    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.


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #58599

    chloethomas
    Participant
    Post count: 6

    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.

    #58636

    braddalton
    Participant
    Post count: 9375

    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. http://wpsites.net/web-design/add-logo-or-full-width-header-image-to-generate-theme/


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

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

You must be logged in to reply to this topic.