Configuring and styling the search results page

Overview

Create your own search dialog and adjust spacing between items, colors and typography for absolutely everything on search sections.

Search builder

From the dashboard go to Theme Settings » Search.

Intro Section

Heading » Content

Type custom title to inform visitors when there are search results or nothing is found.

» With results
» No results

Heading » Color

You can set the color for the all headings of the Search page.

» Text Color

Heading » Typography

You can set the color for the all headings of the Search page.

» Font Type (Google Font or Custom Font)
» Font Family
» Font Style
» Font Size
» Font Weight
» Line Height

Search Term » Color

You can set the color for the search term text of the Search page.

» Text Color

Search Term » Typography

You can set the color for the search term text of the Search page.

» Font Type (Google Font or Custom Font)
» Font Family
» Font Style
» Font Size
» Font Weight
» Line Height

Description » Content

Type custom description to inform visitors when there are search results or nothing is found.

» With results
» No results

Description » Color

You can set the color for the all paragraphs of the Search page.

» Text Color

Description » Typography

You can set the color for the all paragraphs of the Search page.

» Font Type (Google Font or Custom Font)
» Font Family
» Font Style
» Font Size
» Font Weight
» Line Height

Button » Color

You can set the color and hover color for the all buttons of the Search page.

» Background Color
» Background Hover Color
» Text Color

Button » Typography

You can set the background color, text color and text hover color for all buttons on the Search page.

» Font Type (Google Font or Custom Font)
» Font Family
» Font Style
» Font Size
» Font Weight
» Line Height

Field » Color

You can set the color and hover color for the all fields of the Search page.

» Background Color
» Background Hover Color
» Text Color

Field » Typography

You can set the background color, text color and text hover color for all fields on the Search page.

» Font Type (Google Font or Custom Font)
» Font Family
» Font Style
» Font Size
» Font Weight
» Line Height

Content Area

Section » Layout

You can adjust the layout of the Search page. The set layout will be applied to the section container.

» Max Width
» Vertical Padding
» Collumns

Section » Color

The selected background color will be applied to Search page.

» Background Color

Post Item

Block » Color

You can set the background color for the all Search page post items.

» Background Color

Heading » Color

You can set the color for the all headings of the Search page post items.

» Text Color

Heading » Typography

You can set the color for the all headings of the Search page post items.

» Font Type (Google Font or Custom Font)
» Font Family
» Font Style
» Font Size
» Font Weight
» Line Height

Excerpt » Color

You can set the color for the all excerpts of the Search page post items.

» Text Color

Excerpt » Typography

You can set the color for the all excerpts of the Search page post items.

» Font Type (Google Font or Custom Font)
» Font Family
» Font Style
» Font Size
» Font Weight
» Line Height

Link » Color

You can set the color and hover color for the all links of the Search page post items.

» Text Color
» Text Hover Color

Link » Typography

You can set the color and hover color for the all links of the Search page post items.

» Font Type (Google Font or Custom Font)
» Font Family
» Font Style
» Font Size
» Font Weight
» Line Height