Stacked Centered Nav
An editorial masthead with utility links and search, a large centered wordmark, sign in and subscribe actions, and a centered section link row below.
An editorial masthead with utility links and search, a large centered wordmark, sign in and subscribe actions, and a centered section link row below.
Search blocks by description or jump to a page.
The source for every Marketing block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Stacked Centered Nav is an editorial masthead built in two stacked rows. The top row runs a three column grid: search and utility links on the left, a large centered wordmark with a mark in the middle, and sign in beside a subscribe CTA on the right. A hairline rule divides it from a centered row of section links beneath. On mobile the side utilities collapse into a slide in sheet while the wordmark holds the center.
The section links and utility links are separate arrays, and the sheet concatenates them so the full navigation survives on small screens. The symmetric grid keeps the wordmark centered regardless of how wide the side columns grow, and the lower link row hides below the large breakpoint to keep the header compact. Swap the wordmark and the section list for your own publication.
Reach for this block when the site reads like a publication and the name deserves the center of the page: magazines, newsletters, review sites, and content brands. It sets a slower, editorial tone than standard-sticky-nav, which leads with the logo on the left, and gives a long section list room to breathe on its own row rather than crowding the masthead.
A natural flow around it on a Marketing Pro page:
Before
After
One strong use is an independent publication with a handful of sections. Other fits:
Tip: the lower row is the place for breadth, keep the top utilities to two or three so the wordmark stays the loudest thing on screen.