Appearance → Customize → Header → Header layout.
The bar holds up to five things: the logo, the primary menu, the social links, the search icon and the call-to-action button. The layout decides how they are arranged. It is a picture-radio, so you can see each one before choosing.
The three layouts
Logo left (default)
Logo at the left, then everything else packed to the right: the menu, then the social links, search and button as a group.
The workhorse. It reads left to right in the order a visitor scans, and it is the only layout that keeps the whole bar on one line at any height.
Logo center
Logo centred. The menu goes to one side of it, the social/search/button group to the other.
Best when the site name is the brand and the menu is short — four or five items. A long menu on this layout unbalances the two sides and starts wrapping.
Nav below
Logo row on top, with the social links, search and button; the primary menu gets its own full-width row underneath.
Pick this when the menu is too long to sit beside the logo, or when you want the menu to read as a band across the page. The theme pads the page down to clear the extra row automatically, so nothing is covered by the fixed bar.
Two details specific to Nav below:
- The second row spans the full width of the bar, so its dividing line runs edge to edge rather than stopping at the content width.
- On tablets and phones the second row is hidden along with the rest of the desktop bar — the mobile menu carries the menu there.
What is the same in all three
| Height | Header height — 50px to 120px, 60px default |
| Colours | Header skin and the two pickers under it |
| Sticky | Sticky header — on by default |
| Mobile | Below the tablet breakpoint every layout collapses to a logo, a hamburger, and the off-canvas panel |
Where the option lives
Header layout sits in the Header section, not Design → Header, because it is an arrangement you choose rather than a colour or a font. The same section holds the search toggle, the social toggle and the button; Design → Header holds the skin, colours, height, border and menu typography. Each section links across to the other at the top of its panel.