Your header is the first thing visitors see: your logo, your main menu, the button you want them to click. On most WordPress themes, that layout is fixed, and even a small change means custom CSS or editing a child theme. Utopia takes a different approach with a built-in Header Builder that lets you rearrange the header without touching code.
What the Header Builder does
Inside Utopia’s “Header Settings” screen, turning on “Enable Header Builder” splits the main header row into three areas — left, center, and right — and lets you decide what goes in each one. Once it’s on, this grid layout takes priority over the theme’s traditional “menu position” setting.
Six modules, three zones
Each of the three areas can be assigned one of six modules: empty, logo/site title, main menu, CTA button, search, or social icons. That’s enough to recreate common corporate layouts — logo on the left, menu centered, CTA button and search on the right — entirely through the admin screen. It’s just as easy to flip the pattern: a centered logo with the menu split across both sides is a common choice for brands that want their header to feel less conventional.
The CTA module ties into your header CTA settings
The CTA button module pulls from the same Header Settings screen’s CTA fields, which support separate text and URL for Japanese and English. On a bilingual site, that means the button in your header can read differently for each language without any extra setup. Button background and text color are configurable too — leave them blank and Utopia falls back to your site’s main color automatically.
Search and social icons are modules too
Placing the “Search” module adds a clickable icon that opens a search overlay wherever you put it in the header. The “Social icons” module works the same way — it can sit in any of the three zones. That makes it possible to put your contact CTA and your social links in the same line of sight, instead of pushing one of them into a separate widget area.
Works across every site type
This row-and-column layout isn’t limited to one particular site type, like Corporate Pro or Portal — it’s available regardless of which Utopia site type you’re running. It’s a useful option when you want to adjust how the header looks without touching your existing design or content settings.
Pairs with sticky header and the announcement bar
The same Header Settings screen also includes a sticky header (with an optional “smart sticky” mode that hides on scroll down and reappears on scroll up) and a thin announcement bar across the top. Both stack cleanly on top of whatever layout you build — so a centered logo with the CTA on the right can also stay pinned in view as visitors scroll, just by toggling a separate setting.
Try it in Header Settings
Because changes are visible in the admin screen before anything goes live, you can experiment without risking your current header. Open “Header Settings,” turn on “Enable Header Builder,” and start by deciding which single element — the CTA button, search, or something else — you most want visitors to see first.
