Navigation, Header & Footer

Before you publish anything: premium defaults, not a blank chrome

If you've never published a Header or Footer design, your store doesn't show a bare, unstyled navbar and footer — since the 2026-07-12 premium-by-default rollout it automatically renders a premium default instead: a centered logo, split navigation header and a centered minimal luxury footer, both built from your real branding (logo, store name, and navigation links) rather than placeholder content. This also applies if your store's saved header/footer design ever fails to load. Publishing your own Header or Footer design here replaces the default immediately and permanently for that surface — there's no way to intentionally revert to the automatic default once you've published something.

Adding blocks to a row's Design tab

A row you've added (or a native row your template already had) can carry extra content blocks via its own Design tab, alongside the fields described in this guide — a separate, more advanced authoring surface for merchants who want to compose a row from smaller building blocks rather than use the row's built-in fields. If you add a block there, a "Keep this row's built-in layout" switch on that same Design tab controls whether your new blocks render alongside the row's normal built-in content (switch on, the default) or replace it entirely (switch off). Removing every block you added there returns the row to its plain built-in layout automatically. This guide covers the built-in fields (Utility Bar, Announcement, Navigation Links) in depth; the block-composition surface itself is a broader feature this page doesn't yet document end to end.

Clicking previews AND stages — hovering only previews

Clicking a look card updates your live preview immediately and keeps it there — even after you move your mouse away — until you click another card, hit Apply, or leave the drawer. Hovering without clicking only shows a temporary preview that reverts the moment you stop hovering. If you're unsure whether you've staged something or are just previewing, check the badge: a hover-only preview shows Previewing, never Selected.

Theme Settings (the old Config tab) still applies here

The Theme Settings entry in the sidebar holds the same controls the picker's Config tab used to — Content (button labels, search placeholder, and other chrome strings for the selected template), Features (toggle search, mega-menus, and the commerce icons below), and, under Advanced, colour overrides where available. Switching structure or look does not change these — they carry over regardless of which design you land on.

Masthead and Dept Store — the two newest header designs

Both are three-tier structures (a slim utility strip, a main identity row, and a navigation ribbon below it) rather than the single-row bar the other 9 templates use. Masthead is a logo-dominant, editorial layout — generous vertical whitespace around a large centred logo, in the style of a newspaper masthead; its utility strip (contact/locale) is off by default, so most stores see just the logo row and nav ribbon. Dept Store is more compact and utility-first — its utility strip (policy links and locale label) is on by default, sitting above a standard-height main bar and nav ribbon. Both read their utility-strip content from the same Utility Bar fields described under Header navigation below (utility policy links, locale label) — Masthead just doesn't show that strip until you turn its Show Policy Links / Show Locale/Currency Theme Settings toggles on.

Transparent Overlay — a header that floats over your hero, no bar visible until you scroll

This template renders with a fully transparent background directly over whatever is at the top of your homepage (typically a hero banner/image) — no bar, no border, no shadow. Once the customer scrolls down about 80 pixels, it automatically "solidifies": a solid background, border, and subtle shadow fade in, and the text/icon colour switches from light (for legibility over a photo) to your regular dark text colour. This solidify distance is fixed today (not yet a Theme Settings control). Because it reserves no space at the top of the page, it works best directly above a tall hero section — over a plain white background the effect is barely visible since there's nothing for it to "float over." This is a different mechanism from the classic Header editor's own Scroll effect toggle described below (Header appearance) — that one applies to whichever template you pick and lets you choose your own initial/scrolled colours; Transparent Overlay's overlay-and- solidify behaviour is built into the template itself and isn't combined with the classic Scroll effect toggle.

Side Rail — a vertical navigation column instead of a top bar (desktop only)

Side Rail replaces the usual horizontal bar with a fixed vertical column pinned to the left edge of the screen, spanning the full page height — your logo near the top, navigation links stacked underneath, and search/cart/account/login/signup toward the bottom. It doesn't reserve space at the top of the page the way every other template does. On phones and small tablets a full-height side column has nowhere to go, so Side Rail automatically collapses to the same compact top bar with a hamburger menu every other template uses on mobile — the rail itself is a desktop-only layout. The original 4 arrangements still apply on desktop: Standard stacks logo → navigation → actions top-to-bottom; Centered Split puts half the navigation above the logo and half below it (vertically centering the logo in the rail); Stacked groups the logo and action icons together near the top with navigation filling the rest; Logo Right (the vertical mirror of "logo right") pushes the logo down to the very bottom of the rail, with navigation and actions above it. The 3 newer arrangements (Nav Collapsed, Full Center, Nav Centered) are also selectable on Side Rail, but this doc doesn't yet have a verified description of how each rearranges the vertical column — if you pick one and the layout looks unexpected, switching back to Standard, Centered Split, Stacked or Logo Right is the safest known-good choice.

All 11 header templates require a paid plan

Every header structure is a flagship design, so on the Free plan every option in the structure switcher's menu shows a lock icon instead of the usual selectable state — clicking a locked option does nothing. Hover it to see "Upgrade to a paid plan to unlock flagship templates." The moment your store is on any paid plan — Starter, Growth, Pro, or Max — every structure unlocks; you don't need Pro or above specifically. Go to Billing → Plans & Billing to upgrade (see Plans & Billing). If a structure still shows locked right after you upgrade, reload the Admin Panel — the switcher reads your plan from a subscription check that runs when the page loads, so it can lag a freshly-completed upgrade by a page refresh.

A template can also show as unavailable

Separately from the plan lock above, a structure in the switcher's menu can be marked unavailable and become unselectable for a different reason (for example, it isn't ready yet) — hovering it explains why.

Default: Centered Logo Split Nav, Centered Split

If you've never published your own header design, your store's default is the centered logo, split navigation layout (see Before you configure anything in Page-Layout Pickers) — the same look you'd get by explicitly picking the Centered Logo Split Nav template with the Standard variant.

Two places can hide an icon — both must be on for it to show

These Theme Settings toggles work together with the classic Store Branding switches in the Header editor's Desktop mode below (Show cart / Show wishlist / Show user-menu icons): an icon renders only when both its Theme Settings toggle and its Store Branding switch are enabled. If you turned on Show Cart Icon here and the icon still doesn't appear on your storefront, check the matching Store Branding switch — either control alone can hide it, and remember the change reaches customers only after you Publish (Save Draft keeps it in the editor).

Footer bands — a shared default, not the same thing as the Style tab's Colour section

The Footer bands row carries a caption clarifying what it actually sets: "This sets the shared default background for every footer band. To style one band differently, select it in the Structure list and use the Style panel's Colour section instead." It's easy to read this row and the Footer editor's Style tab → Colour section (see Styling one band, group, or link: the Style tab below) as the same control reached twice — they aren't. Footer bands here is the one shared default every band in your footer falls back to before its own override; Style → This selection on one band sets that band's own colours specifically, and always wins over this shared default for that band.

Transparent — content sits directly on whatever ground you set below

On the Footer's Footer and Footer bands rows, Transparent is a translucent, colour-mix look rather than a solid fill — pick it when you've set a Ground image or Gradient-mesh ground (below) and want the photo or mesh to show through the surface clearly instead of sitting behind an opaque colour panel.

Footer bands mesh swatches are disabled on a footer with no bands

The Footer bands row's Gradient-mesh ground swatches only affect anything once your footer has at least one band (added from Compose this band with blocks below, or by picking a Look that seeds one). With zero bands there is no band surface left for those colours to paint, so the swatches are disabled — dimmed, not clickable, and skipped by keyboard tabbing — rather than silently accepting clicks that saved a value with no visible effect. Add a band first, then come back to set its gradient-mesh ground.

Ground composition — Boxed Card Newsletter footer template only

On the Boxed Card Newsletter footer template specifically, a Ground composition dropdown offers two options: Inset card (default) — the ground (colour, image, or mesh) fills the whole footer, and your content floats in an opaque card on top of it — and Transparent — your content sits directly on the ground with no card behind it, letting a photo or mesh ground show through uninterrupted. Every other footer template has no card to toggle, so this control doesn't appear for them. It's a per-band control, not a page-wide one: select the Legal Strip or Info band in the sidebar tree (Config mode — see Styling one band, group, or link: the Style tab below for the Config/Style toggle) and it appears near the bottom of that band's settings panel, not in the Layout Axes list.

Footer bands styling only shows once your footer uses bands

The Footer bands row's Scheme, Emphasis, Ground image, and Gradient-mesh ground only take visible effect once your footer has at least one band (Online Store → Theme → Page Layouts → Footer, sidebar tree — see Managing footer bands further down this page). On a store still using its template's default (bandless) footer layout, this row still saves whatever you set, but there's no band surface yet for it to paint — add a band first if you don't see it take effect.

Footer Type — six typography axes on every footer template (Theme Settings → Layout → Layout Axes)

Every footer template's Layout Axes list carries the same six typography controls, all optional and all blank by default (blank = keep this design's own typography, byte-identical to before these controls existed): Footer Text Scale (a percentage — blank keeps this design's own sizes), Column Heading Weight (a font-weight select, blank keeps this design's own weight), Column Heading Capitalisation (Uppercase / Lowercase / Capitalize / none), Column Heading Letter Spacing (a percentage of one em — 12 means 0.12em), Footer Link Weight (a font-weight select for link/body text), and Footer Typeface (a Type Pairing id, blank keeps this page's own typeface — separate from the page-wide Type Pairing control above; setting this swaps fonts only inside the footer). The Reset axes button above the Layout Axes list clears all of them (and every other layout axis for the current template) back to blank in one click.

Group Numbering and Link Column Background Panel — also in Layout Axes

Two more controls live in the same Layout Axes list, on every footer template: Group Numbering (None / Numeric / Padded / Circled, default None) numbers each footer link column, and Link Column Background Panel (off by default) draws a filled card behind each footer link column — pair it with the Link Column Panel Border checkbox to add a hairline border around each panel. Both are part of the arrangement path's column rendering (LinkGroups), not the 7 templates' own monolithic legacy layouts, so switching your footer's Variant away from Standard (see Footer arrangements below) is what makes the columns these controls style actually render as separate columns.

Wordmark Treatment — five options, including two architectural-scale tiers (Layout Axes)

Also in the Layout Axes list on every footer template: Wordmark Treatment, a select with five options — Display (default; today's plain rendering, untouched), Ghost (the wordmark scales up and fades to a low-opacity backdrop, reading as a decorative watermark behind the rest of the brand block rather than the primary heading), Clipped (a gradient text fill running from your accent colour into your ink colour — a "gradient wordmark" look), Giant (the wordmark grows to a large, viewport-relative display size at full opacity and the template's own colour — it becomes the brand block's primary heading voice, the opposite intent of Ghost's faded watermark), and Bleed (the same Giant scale, but the wordmark also becomes a full-width block that clips itself at its own edge rather than wrapping or overflowing — the "clipped at the band edge" placement). Because five options is more than the four-option cutoff this editor uses for a toggle-button row, Wordmark Treatment renders as a dropdown, not a row of buttons, unlike some of the other Layout Axes controls on this list. Giant and Bleed both make the wordmark reserve its own full-width row rather than sharing a row with a sibling element (a logo, on most templates) and consume the design's display typeface rather than its body typeface, so switching into either can visibly reflow the rest of the band — check the live preview after picking one.

Grid Lines and Motion — two more decorative axes on every footer template (Layout Axes)

Two further Layout Axes controls, both off by default and both purely decorative (they add no new content, only restyle what's already there):

• Grid Lines — None (default), Columns (three evenly-spaced vertical hairlines across the full footer, independent of your actual link-column boundaries — a decorative architectural overlay rather than a per-column rule), or Full (the same three hairlines plus a top-and-bottom hairline framing the whole footer). The hairline colour follows your footer's own ink/scheme colour, not a separate colour field.
• Motion — None (default) or Subtle, which adds hover choreography only — a colour/underline transition on link hover and a small lift on social icon hover. This is a different control from the band-level scroll-reveal ("fade up as the customer scrolls to it") that already existed before this wave; Motion doesn't touch that. Motion respects the customer's OS-level reduced-motion setting — a customer with "Reduce motion" turned on sees no hover transition at all, content and links unaffected.

Show Brand Name and Footer Link Display — two more Layout Axes on every footer template

• Show Brand Name — on (default) or off. Your footer always shows both your brand logo image and your store name as text next to it; turning this off hides the text name and keeps the logo image (the logo's alt text stays set either way, for accessibility). On by default, so every existing store renders unchanged until a merchant explicitly turns it off.
• Footer Link Display — Expanded (default), Dropdown, or Collapsed. Expanded is today's look: every link column's heading and its links are always visible, with no click behaviour on the heading. Dropdown makes each heading a disclosure trigger a customer can collapse, but every column starts open. Collapsed starts every column closed, with a +/− next to each heading that expands it on click — useful for mobile-heavy stores with long link columns. Any number of columns can be open at once in either mode; opening one never closes another.

Icon Color — the cart, wishlist, account, and search icons, independent of your nav text colour

Icon Color, in the Header Colors list above, recolours the header's commerce icons — cart, wishlist, account — and the search icon (both its default and active states) without touching your nav link text colour. It's a separate colour axis from Nav Link Color: before this control existed, those icons always followed your nav text colour, so a merchant who wanted, say, a dark-on-light nav with a brand-accent icon set had no way to split the two. Leave it blank and every icon keeps following your existing nav ink colour exactly as before — this swatch is unset by default on every store, so nothing changes until you pick a colour here.

Decorative Treatment — an optional ornament on the header bar

Theme Settings → Layout has a Decorative Treatment select, off by default. Turning it on adds a subtle art-direction touch to the header bar: a floating-island inset, an editorial frame, a grid-lines pattern, a neon glow, one of three rule/underline styles (hairline, double, or thick), a heavier frame weight, a grain/noise texture, or a top-to-transparent gradient scrim (useful for keeping light header text legible over a photographic hero on templates without their own solidify-on-scroll behaviour). Leaving it unset renders exactly as before — this is purely additive polish, not a required step.

Layout Axes — more per-template controls live further down the same Layout group

Below Spacing Rhythm, Corner Radius, and Decorative Treatment, the Layout group shows a Layout Axes list of extra controls specific to your currently-active template — this guide doesn't enumerate all of them for all 11 templates, since each template contributes its own set. One worth knowing about: Underline Menu Links on Hover, a plain on/off switch (off by default) that adds an underline beneath a nav link while the customer's pointer is over it — available on the templates whose contract defines it. If a control you're looking for isn't in this guide, check this Layout Axes list on your own active template — it changes what's shown as you switch template.

Shrink Header on Scroll — a Layout Axes toggle, separate from Sticky Behavior above

Theme Settings → Layout → Layout Axes (the same per-template axis list the callout above describes) carries a Shrink Header on Scroll switch on every one of the 11 header templates, off by default. Turn it on and the header bar's own height eases down as the customer scrolls past the threshold, with the logo and nav clamped to that shrinking bar rather than scaling or blurring the way an earlier version of this effect did. It composes with whatever height you've set on the header (a custom bar height shrinks from that height, not a hardcoded default). Side Rail shows the toggle too, but the template has no bar-height axis to shrink, so turning it on there has no visible effect; Masthead shrinks its ribbon row specifically rather than its identity row. There's no separate control for how much it shrinks by — the underlying shrink-scale value exists in the data model but isn't exposed as its own Layout Axes field on any template, so every store that turns the switch on gets the same built-in shrink amount.

Search Style — three shapes for the search field (Layout Axes, 8 of 11 templates)

Theme Settings → Layout → Layout Axes carries a Search Style select on 8 of the 11 header templates — Two Tier Utility Bar, Transparent Overlay, Dept Store, Side Rail, Floating Pill Navbar, Retro Arcade Bar, Masthead, and Tech SaaS Bar — with three options:

Centered Logo Split Nav, Minimal Hamburger Bar, and Serif Luxury Bar don't show this control at all — those three templates ship with no search field, by design (Minimal Hamburger Bar stays deliberately bare; Centered Logo Split Nav and Serif Luxury Bar's curation briefs specifically omit login/search/signup to keep the bar uncluttered). If you've switched to one of those three and expected to see Search Style, that's why — switching to any of the other 8 templates brings the control back.

Spacing Rhythm also scales the header bar height — only when Header Height is left blank

Theme Settings → Layout has its own Spacing Rhythm select — Compact, Standard, or Generous, same naming as the page-wide "Set a Spacing Rhythm" control described under Theme Customization for page sections, but this one is scoped to the header itself. It scales your header's bar height — Compact = 0.5×, Standard = 1× (no change), Generous = 1.5× the template's own reference height.

An explicit Header Height wins. If you've set the Header Height number under Layout Axes to a specific value, that value is what renders, full stop — Spacing Rhythm's scaling branch only runs when Header Height is left blank. A merchant who sets a Header Height and then changes Spacing Rhythm will see no change in the bar at all; that's expected, not a bug. To let Spacing Rhythm control the bar height again, clear Header Height back to blank (its reset icon, where shown, or delete the value).

A chevron marks links that open a panel

Once a link has a mega panel or a disclosure panel configured, the storefront shows a small chevron next to its label so customers can see there's something to open — plain links (nothing configured under Opens) render without one. This is automatic and not a separate setting. It shows on all 11 header templates except Minimal Hamburger Bar, which already has its own +/- disclosure indicator for the same links.

Mega panels work on category links too

A Category Filter or Multi-Category link can carry a mega panel, disclosure panel, side drawer, or takeover exactly like a route or external link — pick one from Opens once you've made your category selection, same as above. The panel is tied to the link itself, not to the category selection that produced its URL: if you go back and change which category (or categories) the link points to, the panel you configured stays attached and doesn't need to be rebuilt.

Dropdown style — a nested, multi-column dropdown (Tech/SaaS Bar template)

Screen: Online Store → Theme → Page Layouts → Header (or Store Branding → Navigation), Navigation Links → click a link's edit icon, or Add Link. Below the path/URL field, a Dropdown style (optional) select offers Simple (flat dropdown / mega panel) (the default — today's flat list or mega panel, unchanged) and Multi-column (categories reveal nested links on hover). It only appears for Route, External URL, Category Filter, and Multi- Category links — not for a Dropdown (simple list) link, which has its own separate nesting model (see the "Two different 'dropdown' concepts" note above). Picking Multi-column shows a hint pointing you to that link's Mega Panel — each category entry there can now carry its own one-level-deep list of nested links, edited inline (drag to reorder, add/remove, each with a Label and URL) right under that category's row.

Selecting Multi-column only takes effect once that link has categories authored through its separate Edit mega panel action (opened from the link's row actions in Navigation & Layout, not from inside the Edit Link dialog). Until at least one category with links is added there, the link keeps rendering its previous dropdown (its disclosure panel, if one is authored, or its flat sublinks) and the Edit Link dialog shows an inline warning reminding you to open Edit mega panel. If your template doesn't have Mega Menu enabled, enable it first (Header settings → Mega Menu capability) — the warning text changes to mention this when it's off.

On the storefront, a customer hovers or Tab-focuses the nav link to reveal the panel, then Arrow Right on a category reveals its nested links, Arrow Left returns to the category list, and Escape closes the panel and returns focus to the nav link. On mobile it opens as a nested accordion inside the slide-out menu — opening one category's nested links closes any other open category.

This control is only available on the Tech/SaaS Bar header template today — picking Multi- column on a link and switching to any of the other 10 header templates has no visible effect there (the field is simply not read by those templates yet). Leaving Dropdown style on Simple (the default) never writes the field at all, so an untouched link's dropdown renders exactly as it always has. Troubleshooting — my multi-column dropdown isn't multi-column: confirm you're on the Tech/SaaS Bar template, and that Dropdown style is actually set to Multi-column on that link (not just that its Mega Panel has categories) — a Mega Panel's column/entry structure with Dropdown style left on Simple still renders as the regular flat mega panel. My nested links aren't showing: nesting only goes one level deep below a category — a nested link that itself has children won't show its own dropdown, and the nested-links editor itself only appears once the OWNING link's Dropdown style is set to Multi-column, not per category.

Submenu Arrow — a Layout Axes control for the dropdown chevron

Every header template shows a small chevron next to a nav link that opens a mega panel, disclosure panel, side drawer, or takeover, to signal there's more underneath — except Minimal Hamburger Bar, which never renders an inline dropdown-style nav link at all (its only nav surface is the full-screen slide-out overlay), so there's no attach point for a chevron on that template. On the other 10 templates, this chevron is a merchant-facing setting: open Online Store → Theme → Page Layouts → Header (or Edit Header → HEADER for a premium template), select your header row in the structure tree, and scroll the settings panel to Layout Axes. Find Submenu Arrow (dropdown links with a panel/mega-panel/sublinks) in that list and set it to Chevron — it's a two-option control (None / Chevron), rendered as a small toggle since there are only two choices. Leave it at None (the default) and no arrow shows on any link, exactly as before this control existed — zero visual change until you opt in. Only nav links that actually carry a mega panel, disclosure panel, side drawer, takeover, or a simple-list dropdown pick up the arrow; a plain link (a bare URL with Opens left at its default and no sublinks) never shows one regardless of this setting, since there's nothing under it to signal. The arrow also rotates when the customer opens the panel it belongs to. Troubleshooting — no arrow on a link even with Chevron selected: check that the link actually has a panel or sublinks attached (its Opens field is something other than the default, or it's a Category Filter/Multi-Category link with a panel — see the "Mega panels work on category links too" note above); a link with nothing configured under it has no panel to signal and stays arrow-less by design.

Icon shape — Cart, Wishlist, Account, and Search (Layout Axes)

Open Online Store → Theme → Page Layouts → Header, select your header row in the structure tree, and scroll the settings panel to Layout Axes. Four controls let you pick the visual style of the header's action icons, each independent of the others:

Leave a control on Default and that icon renders exactly as it always has — nothing changes until you pick a different option. The Search Icon control has one special case: Default always shows the classic magnifying-glass symbol your storefront has always used, even though the other three options switch to a matching line-icon design. Search Icon only appears on templates that have a search bar (Centered Logo Split Nav, Minimal Hamburger Bar, and Serif Luxury Bar don't, so those three templates show only the other three controls). These controls are purely cosmetic — they never change what the button does, only how it looks.

Troubleshooting — I picked an Account Icon and don't see it on the storefront: the account icon only renders once a customer is signed in, on templates that show separate Login/Sign up buttons for guests (most templates do). Sign in to preview it, or check a template that doesn't pair Login/Sign up buttons with the account icon.

Theme default, and what it renders as per template

The Alignment select's first option is Theme default, not a pre-selected side — leaving it untouched saves nothing for this field, and the storefront falls back to the template's own built-in alignment. On the 8 templates that share the common utility-strip renderer, Theme default renders centered on phones, right-aligned from tablet width up. Two Tier Utility Bar, Masthead, and Dept Store each read this same field but keep their own bespoke default when it's unset — Two Tier Utility Bar centered (centered-right from tablet width up), Masthead centered on both mobile and desktop, Dept Store right-aligned on both. Picking Left, Center, or Right explicitly overrides the template's default on all 11 templates alike.

These new fields need a Top Bar Content pick to show up

Current language, Current currency, Utility bar message/link, and the three new link lists render only once you set Top Bar Content (in Layout → Layout Axes, under Announcement & Utility Bars as Their Own Rows — see that section later in this guide) to something other than Contact info. With Top Bar Content left on Contact info (the default), the strip shows only Contact phone/email, Location address, Locale label, and Utility policy links, exactly as before these fields existed — that's by design, not a bug, and keeps every existing store's utility strip byte-identical until a merchant opts in.

Limitation: this Top Bar Content control itself only has somewhere to render once Announcement & Utility Bars as Their Own Rows is set to Stacked — see the callouts on that control later in this guide. On a header that instead uses one of the 11 premium header templates' own tier rows (the sidebar-tree Utility Bar row documented above), these six fields don't render yet regardless of any Layout Axes setting — that wiring is a follow-up.

Theme default renders centered

The Alignment select's first option is Theme default, not a pre-selected side — leaving it untouched saves nothing for this field, and the bar renders centered, the same as it's always looked. Pick Left, Center, or Right explicitly to override that. Unlike the Utility Bar's Alignment control (which has three bespoke-template exceptions), this one applies identically on all 11 header templates that can carry an Announcement row.

Ground image and inline logo don't show yet in the editor's own live preview

Both fields are confirmed wired to the real storefront — a saved value renders correctly once you Publish. They aren't reflected in this editor's live-preview canvas yet (a separate preview component that hasn't caught up to these two fields), so don't judge whether they saved by watching the preview here — check the published storefront instead.

This is not the page-builder Promo Banner or Announcement Bar section

This header Announcement bar is separate from the Promo Banner and Announcement Bar content sections available inside individual pages via + Add Section in the Section Library — those are page-content blocks you place and configure per page. This one lives in the header itself and shows on every page of your storefront once Message (or, in Rotating mode, Messages) is filled in.

Not visible on this header? It's using its own tier stack instead

Most of this Layout Axes section — the master switch above, Announcement Bar Position, Announcement Bar Behaviour, and Top Bar Position — only shows up when the header's structure tree has no tiers configured. Once you've built a tier stack (added rows under Structure on the header's own settings panel), those four controls disappear and are replaced by a single italic line reading "This header uses a tier stack; row/placement controls don't apply.", because the tier-stack renderer never reads any of them — showing controls with no effect would be misleading. To get back to them, click the Remove tier stack link that appears just below that italic line — it clears only the tier stack (config.tiers), leaving your colours, typography, and every other Layout Axes override on this header untouched. This is different from the panel's own Reset all, which wipes every override on the header, not just the tiers — use Reset all only if you mean to start this header completely over.

Exception (2026-09-03): on the 8 templates that use the shared Utility Bar row (Centered Logo Split Nav, Floating Pill Navbar, Minimal Hamburger Bar, Retro Arcade Bar, Serif Luxury Bar, Side Rail, Tech SaaS Bar, and Transparent Overlay), Top Bar Content, Use full width, Show on mobile, Keep visible on scroll, Show separator line, and every control in Top Bar Style Axes below stay on the panel and render fully enabled on a tier-stack header — no "Requires Stacked" hint, no need to switch the (now-hidden) master switch to Stacked. The tier-stack renderer reads these directly, so they take effect on your tier stack's Utility Bar row immediately. Two Tier Utility Bar, Masthead, and Dept Store keep their own bespoke, hand-styled utility strip (see the warning below and the Utility Bar section above) and never show these controls at all, tier stack or not.

Grid Zones — configuring the new Announcement grid

Once Announcement Bar Behaviour is set to Grid, a Grid Zones section appears on the Announcement row's own settings panel with three columns — Left, Center, Right. Each has an Add item button; every item gets a Text field, an optional Link field, a drag handle to reorder within its own column, and a delete icon. Items render side by side within their zone; an empty zone renders nothing. Content you author while Grid is selected is kept if you switch to another Behaviour and back — it only renders while Grid is the active Behaviour.

Which fields each Top Bar Content variant shows

Each non-default variant pulls a fixed set of fields into fixed left/centre/right slots — a field you haven't filled in is skipped, not shown blank:

• Menu — Menu links (left); Contact phone, Account links (right)
• Selectors — Current language, Current currency, Account links (right)
• Social — Social links (left); Message, Contact phone (right)
• Split — Contact phone, Contact email (left); Utility policy links, Current language, Current currency, Account links (right)
• Centered message — Message (centre only)

If you switch Top Bar Content and a zone looks empty, it's because none of that variant's fields are filled in yet — fill in the relevant field(s) above (Menu links, Account links, Social links, Current language, Current currency, or Message), or switch back to Contact info.

On a narrow screen, overflowing items collapse into a More menu instead of clipping

Menu, Selectors, Social, Split, and Centered message all lay their items out in the same left/centre/ right zone strip, and at narrow widths (a small laptop or a merchant with a long phone number, long menu labels, or a bumped-up font scale can all trigger it — it's not just a phone-sized breakpoint) there isn't room for every item at full size. Whichever items stop fitting collapse into a More button at the end of the row instead of being squeezed down to an unreadable, untappable sliver; clicking or tapping More opens a small panel listing the collapsed items so links and account actions stay reachable. This applies to every Top Bar Content option except the default Contact info — that strip keeps its original hard-clip/ellipsis behaviour unchanged, so an existing store that has never touched Top Bar Content renders exactly as it did before.

This is a separate control from the existing Show separator line toggle

The classic Show separator line toggle above only ever draws a bottom border. This new border set (style, width, colour, radius) is additive and controls the strip's full border on all sides — the two can be combined, since they apply through the same style object rather than replacing one another.

Trending searches and Popular right now (Takeover only)

On the Takeover style, the search overlay shows a row of trending-search chips plus a "Popular right now" preview grid for the top trending term. These are backed by the store's own search history over the trailing 30 days, falling back to the store's most recently added active products if there's no search history yet. The preview grid is a fixed snapshot of that one term's products — it does not update live as the customer types, since the overlay doesn't yet forward the typed query back to the storefront app.

Logo Height (%) always wins if both are set

The two fields are the same control at two resolutions, not two independent settings. If you set both Logo Height (px) and Logo Height (%), the percentage is what renders — the pixel field stays saved and visible, but has no visible effect until you clear the percentage. Percentage wins deliberately: it's the one that stays correct if the bar's own height later changes (a custom Bar Height value, or Shrink Header on Scroll), so it takes priority over a fixed pixel value that can't adapt. If you only ever set one, that one applies normally.

A mega panel only replaces the dropdown for links that have one configured

Configuring a mega panel for a nav item makes it supersede that link's own (older, flat) dropdown — every other link keeps rendering whatever it rendered before. An empty panel (no columns with content and no promo tile) is treated as "nothing configured" and the link falls back to its plain behaviour, so clicking Configure and leaving everything blank has no visible effect.

How your image tile's caption renders

The tile's Heading (and Link, if set) render as a caption overlaid on the image itself, with a darkened scrim behind the text so it stays legible over a busy photo — this is the default. A handful of disclosure-panel/mega-menu styles instead place that same caption below the photo rather than overlaid on it; which one you get follows the panel's own visual style, it isn't a setting you choose per tile.

Most of my action cluster is behind More — why?

The cluster ran out of room, which usually means the header variant is sharing that side of the bar with your navigation. Centered split and Nav centered put navigation links in the same track as the icons, so a long navigation squeezes the cluster first. Three fixes: turn off header icons you don't use (Config tab — wishlist and search are the usual candidates), shorten your navigation Labels, or switch to the Standard variant, which gives the action cluster the whole right-hand side of the bar.

Why are some of my links under More?

It means the navbar ran out of room, not that anything is misconfigured. Three things widen it again: shorten link Labels (the single biggest factor), toggle Enabled off on links you don't need in the top nav, or switch the header variant — Nav centered hands the navbar the whole middle of the bar, and Centered split divides your links either side of the logo, both of which fit more links than a left-aligned bar. Turning off header icons you don't use (wishlist, search) in the Config tab frees space too.

Colour fields disappear once you're on a premium template

Background colour, Text colour, Scroll effect, and the two scrolled-colour fields above only appear on this card while your store is still using the legacy (classic, pre-template-picker) header. The moment you publish any of the 11 premium header templates described earlier in this guide, this card stops showing them — premium headers get their colours from the Color Schemes panel on the Theme Settings entry instead. There's no banner explaining the switch; if a colour field you remember setting has quietly disappeared from this page, that's why.

Not available on Masthead or Minimal Hamburger Bar

These seven controls don't appear on the Masthead or Minimal Hamburger Bar templates — both already render a full-height mobile menu with no second height to switch to, so the control would have nothing to do. Every other header template shows them in its Layout Axes list.

All 7 footer templates require a paid plan

Just like the header, every one of the footer's 7 premium structures is a flagship design — on the Free plan each option in the structure switcher's menu shows a lock icon, and clicking one does nothing. Any paid plan (Starter, Growth, Pro, or Max) unlocks all 7; upgrade from Billing → Plans & Billing (see Plans & Billing). If a structure still shows locked right after upgrading, reload the Admin Panel so the switcher re-checks your plan.

Why did my footer's headings change font after I picked a look?

A look's art direction writes directly into the same Footer Type axis fields described above — Column Heading Weight, Capitalisation, Letter Spacing, and so on. If you'd rather keep your own typography after picking a look, clear those fields individually or click Reset axes above the Layout Axes list to blank all of them back to this design's own defaults; picking a different look afterwards will set its own values again.

Reset axes also clears a Look-seeded band

Clicking Reset axes above the Layout Axes list on a footer whose current seeded band still matches the Look that created it also removes that seeded band, since the band's imagery and copy exist specifically to match the axes being reset. It never touches bands you've since edited by hand, or bands you added yourself.

Standard is still the default everywhere

Nothing switches you onto one of the other 4 arrangements automatically — every store that hasn't opened the gallery and staged a different arrangement keeps rendering Standard, the exact monolithic footer layout that shipped before this arrangement axis existed. Picking a different arrangement only rearranges where your existing columns, brand block, and social icons sit; it never adds or removes footer content.

Spacing Rhythm also scales the footer's band padding — only when Band Vertical Padding is left blank

Just like the header (see the Spacing Rhythm callout under Sticky Behavior above), the footer's own Spacing Rhythm control — Theme Settings → Layout → Spacing Rhythm, Compact/Standard/Generous, same naming as the page-wide Theme Customization Spacing Rhythm but scoped to the footer itself — scales every footer band's top-and-bottom padding: Compact = 0.5×, Standard = 1× (no change), Generous = 1.5× the template's own reference padding.

An explicit Band Vertical Padding wins. If you've set the Band Vertical Padding number under Layout Axes to a specific value, that value renders exactly as set — Spacing Rhythm's scaling only applies when Band Vertical Padding is left blank. Set both and change Spacing Rhythm, and you'll see no visible change; clear Band Vertical Padding back to blank to let Spacing Rhythm drive it again.

Colour fields disappear once you're on a premium footer template

Background colour and Text colour above only appear while your store is still using the legacy (classic, pre-template-picker) footer. Once you publish any of the 7 premium footer templates, they stop showing here — premium footers get their colours from the Color Schemes panel on the Theme Settings entry instead (see Color Schemes and Type Pairing above).

A Link groups column with no groups saves nothing

If you never open this editor (or remove every group you add), your footer simply keeps using that band's default column content — no empty "Link groups" data is saved at all, so there's nothing to clean up if you decide not to use it.

Both buttons have their own show conditions

The first button only renders once both its label and its URL are set. The second button follows the same rule — label and URL both required — and only ever appears alongside the first button, never on its own: a Call to Action band with only a second-button label and URL filled in (and no first button) shows neither button. Email signup instead only shows once no button label + URL pair is fully set for button 1 — fill in a first button and the email field drops away automatically.

Empty bands and groups render nothing

A Category Links band with no groups, or a group with no items, doesn't show a placeholder — it renders as empty space. Add at least one group with at least one item before expecting to see anything on the storefront.

Composing doesn't clear your blocks when you turn it off

Unlike some other block-composition surfaces in this editor, the footer band composer keeps your block list exactly as it is when you switch Compose this band with blocks off — turning it back on later restores the same blocks, not an empty list.

Tile row is not offered on the footer, or anywhere else, yet

A "Tile row" block type exists in the platform's design vocabulary but has no settings panel built for it yet, so it's deliberately left out of every Add-block picker on every surface, footer included — you won't see it as an option to add.

Footer Typeface vs. a band/group/item's own Typeface override — the band wins

This Footer Typeface select is the same footerTypePairingId field as the Footer Typeface entry in the Footer Type Layout Axes list above — set it in either place and it updates the other, since they're two surfaces on one field. It's the footer's own design-wide default typeface, applied to every heading in the footer. If you've also set a Typeface on a specific band, group, or link via Style → This selection, that per-selection Typeface always wins over this page-wide one for that specific piece — so a footer-wide Footer Typeface pick can look like it "didn't take" on one band when really a more specific override is quietly beating it. Check that band's own This selection → Typography → Typeface field and clear it if you want the page-wide Footer Typeface to show through there too.

Shape — a band-only pair of controls, below Alignment / Content width

Select a band (not a group or item) in the sidebar tree and This selection shows a Shape block the other two selection levels don't get: a Corner shape select (blank/"This design's own corners" by default, or Square / Tight / Standard / Rounded / Pill — the same stepped scale as the Config side's per-band Corner radius) and a Float as an inset card switch (off by default) that makes the band render as an inset card floating on the surrounding surface rather than filling the full width. Both are independent of the page-wide Corner radius on Theme Settings → Layout and of the per-band Corner radius under Per-band spacing & appearance on the Config side — set a Shape value here to override just that one band's shape from the Style tab instead. Leave both blank/off and the band keeps rendering exactly as it did before this control existed.

Why don't I see my footer tagline?

The About text field above is what shows as the short description/tagline under your logo in the footer — it's blank until you set it, so a store that hasn't filled it in simply shows no tagline (not an error). If you've never published a Footer design at all, the copyright line is generated automatically from your store name (for example, “© 2026 Sage & Still. All rights reserved.”) rather than using whatever is saved in the Copyright text field above — publish a Footer design to take control of the exact copyright wording.

Which platforms show up here — now editable from either place

Before 2026-09-03, this band's panel only controlled HOW your social links display, not WHICH ones — you had to go to the Socials tab in Store Branding to add or remove a platform. The new Social Links section above lets you manage the platform list directly from this band too. If no social platforms are connected (via either editor), the Link style choice below has nothing to display, whichever option you pick. See Which card wins if you fill in both? if you also still have the classic Social Handles fields filled in.

The contact row now renders on all 7 footer templates

All 7 footer templates render the contact row now — the last two, Divided Column Sidebar and Split Two-Tone Panel, picked it up most recently. If you've filled in a contact field and still can't see it on your storefront, the usual cause is a stale published bundle rather than a template gap: Publish the footer (Save Draft alone keeps it in the editor only), then hard-refresh.

This card is not part of the Legal Strip / page-editor bridge

Unlike the sections above it on this page, this Features card (and the Show payment icons / Newsletter sign-up fields inside it) is not replaced by a bridge card once you publish a premium template — it keeps rendering here the same as before. Show payment icons does share its on/off value with the payment-methods control on the page editor's Legal Strip row (same field, two mounts), so a change here shows up there too. The newsletter content fields below (placeholder text, button label, consent block) are similarly also editable on the page editor's Newsletter row — but the Newsletter sign-up on/off toggle itself, and Show socials, only exist on this classic page for now.

Newsletter sign-up is a real subscription

When a customer submits the footer's email field, they must also check a GDPR consent box before the button becomes clickable — this applies to every footer design, not just one look. Submitting saves them to your subscriber list — it isn't a decorative form. New subscribers, tagged with source Store, show up in Marketing → Newsletter alongside subscribers captured from your landing pages and hosted sites — see Forms & Newsletter for how to review, filter, and broadcast to your list.

Some footer designs don't show an email field at all. A handful of the more minimal footer looks are deliberately text-and-links only — toggling Newsletter sign-up on has no visible effect for those designs. If you've enabled the toggle and still don't see the email field on your live storefront, switch to a different footer structure using the switcher at the top of the sidebar and check again; most designs do include it.

Second consent block (optional)

Below the newsletter fields, an optional second consent block lets you show a separate opt-in checkbox alongside the newsletter form — useful for a distinct marketing/SMS consent, on top of the regular GDPR consent every footer newsletter form already requires. It has its own Consent heading, Consent checkbox label, and an optional Privacy link text / Privacy link URL pair. Leave all of it blank and the newsletter form renders with just the one, regular consent checkbox — exactly as before.

Both the phone field and the second consent block render only on the same 5 footer templates that have their own newsletter form: Divided Column Sidebar, Boxed Card Newsletter, Split Two-Tone Panel, Inline Column Newsletter, and Panel Card. On Centered Minimal Luxury and Minimal Link (which don't render a newsletter form at all) these fields still save but have no visible effect.

All footer templates now show the same content

Every premium footer template (Template list above) renders the same set of content your classic footer settings define: your About text, the newsletter sign-up description (the line of copy above the email field, editable wherever your newsletter copy is set), the payment-method badges when Show payment icons is on, and the language switcher (if you've enabled multiple storefront languages). If your footer previously looked like it was missing your tagline or payment badges after switching templates, that's fixed — every template now shows the same content, just arranged in that template's own visual style. Stores on plans that include the BillionBiz platform badge also see a "Powered by BillionBiz" link in the footer automatically; it isn't a setting you toggle here.