Search Builder

The Search Builder lets you craft your own search experience — from the search dialog itself to the layout and styling of the results page. Every element on the results screen can be customized: spacing, colors, and typography.

Access it via Theme Settings » Search.

Reference image — replace before publishing16:9

Theme Settings » Search panel, showing the Intro Section, Content Area, and Post Item tabs of the Search Builder.

How it’s organized

The search-results page is split into three areas you style independently:

• Intro Section — the heading, search term, description, and search field shown above the results.
• Content Area — the container that holds the results.
• Post Item — a single result in the list.

Tip

The Intro Section supports two states: one message when results are found and another when nothing matches. Writing a friendly “no results” message with a fresh search field keeps visitors on your site instead of hitting a dead end.

Intro Section

The introduction that appears above the results. Each element has its own content and styling.

Element	Options	What it controls
Heading	Content (for “results found” and “no results”), Color, Typography	The main heading text and its styling, with separate copy for each state.
Search Term	Color, Typography	The styling of the searched term when echoed back to the visitor.
Description	Content (for both cases), Color, Typography	Supporting text, with separate copy for the found and not-found states.
Button	Background / Hover / Text colors, Typography	The search button’s colors and typography.
Field	Background / Hover / Text colors, Typography	The search input’s colors and typography.

Content Area

The container that holds your search results.

Group	Option	What it controls
Section Layout	Max Width, Vertical Padding, Columns	The width of the results area, its top/bottom spacing, and how many columns of results to show.
Section Color	Background	The background color behind the results.

Post Item

A single result in the list. Each part supports colors and typography, including hover states, so results stay readable and clearly interactive.

Element	What it controls
Block	The result container — colors and typography, with hover states.
Heading	The result title — colors and typography, with hover states.
Excerpt	The short preview text — colors and typography.
Link	The result link — colors and typography, with hover states.

Note

Hover states on the Block, Heading, and Link give visitors clear feedback that a result is clickable — a small touch that makes search feel responsive and polished.

For the rest of the site’s layout, see the Header Builder, Footer Builder, and Global Style settings.