Site logo

Archived topic

Make header wider than content container?

3 replies · Started by Kev on April 28, 2021

Viewing posts 1–4 of 4

Hey folks,

New GP user here; I'm still finding my feet, so apologies this is a dumb question.

So I've set my site to be contained, and both the header (I've got "use navigation as header" checked) and content are the same width (720px). However, what I would like to do is have the width of the head be a little wider than the content, but not full width.

So for example, if you look at my live site (not using GP yet) the header bar is wider than the main content block. I realise I can set the header to "full width", but I don't want it to do that - I want it to be a set width, only wider than the content container.

Is this possible with GP? I'm sure it probably is, I just don't know how. Hope I've explained this adequately.

Thanks for any help in advance.

Kev

Hi there,

so you can set the widest width you require ( e.g for the Header and Footer ) in the Customizer.
Then you can override that for the content using a Layout Element:

https://docs.generatepress.com/article/layout-element-overview/

1. Make sure you have the Elements Module enabled in Appearance > GeneratePress.
2. Appearance > Elements --> New Layout Element.
2.1 Go to the Content tab - leave the Content Area as Default and set your reduced Content Width.
2.2 Set the Display Rules > Locations to where you want that applied eg. Entire Site or Posts > All Posts.

Just a note on the logic:
Customizer sets global styles, Layout Elements allow you to override them dynamically for different locations, and then you have the Layout / Disable Element Meta boxes in the post editor which allows you to override them again on a per post / page level.

Perfect, that's just what I needed. Thanks, David.

Glad to be of help

This archived topic is closed to new replies.