StudioPress

Forum navigation

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

How to create full width responsive header w/Genesis Magazine Pro theme

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Community Forums › Forums › Archived Forums › Design Tips and Tricks › How to create full width responsive header w/Genesis Magazine Pro theme

This topic is: not resolved

Tagged: , ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • July 8, 2017 at 12:10 pm #208852
    jlcpvr
    Member

    I've searched for a way to create full-width header on Magazine Pro, but lots of different advice and nightmare crash stories. Is there a plugin to create full width responsive headers? If not, what's the best way to tweak the code to over-ride the settings? I found this...

    How To Add A Full Width Header In Genesis

    and

    Change Logo & Header Image Sizes In Genesis

    But neither seems exactly right for the current Magazine Pro theme, looking at the code. I've backed up both the css and php codes in Notes, but want to make sure I have the best advice before starting.
    I searched the topics but didn't see answer to this -- any help is much appreciated!(My site has not launched yet, just setting up.)

    http://www.paveroads.com
    July 8, 2017 at 12:24 pm #208853
    Brad Dalton
    Participant

    Are you wanting to use a full screen width image or are you referring to using a full width of the content/sidebar container?

    Tutorials for StudioPress Themes.

    July 8, 2017 at 12:40 pm #208856
    jlcpvr
    Member

    Hi, sorry for any confusion. I am trying to create a full-width header image for homepage instead of the default smaller header. Thanks.

    July 8, 2017 at 12:41 pm #208857
    Brad Dalton
    Participant

    Full width of the content sidebar or full screen width?

    Tutorials for StudioPress Themes.

    July 8, 2017 at 1:58 pm #208862
    Brad Dalton
    Participant

    Also, did you try this tutorial which is more specific to what you need.

    Tutorials for StudioPress Themes.

    July 10, 2017 at 12:46 pm #208918
    jlcpvr
    Member

    Hi Brad,
    I saw that tutorial but didn't try because it says "you can change the PHP code for the Custom Header function located under your Appearance Menu, in your child themes functions.php file around line 42" When I copied my php file to notes, line 42 is "child theme do not remove, define child theme" etc. The "add support for custom header" area is at line 101. Also, there are a few other differences from the tutorial example: mine has a line that says 'flex-height' = true and the 'header-selector = '.site-title a' (although yours may have just been cut off, but I only see .site-title) Also, my height is 180 and width is 760.
    Also, in my css style sheet, the header-image area starts at line 1417 (from notes).
    Then to change padding the tutorial says line 1106, but that's also not congruent. (There are many places where .site header appears, including under widgets, etc. but they start at line 1356 under /*Site Header)

    I could just go ahead and change the php code to h=200 and w=1140 and then change the css min-height from 90 px to 200 px as your tutorial shows -- but just want to be sure since there are some differences. Then, I'm not sure how to change padding because mine is different than tutorial.
    Any clarification is much appreciated!

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.