Search page

Search Page is a page where customers can search for specific products, articles or pages. It helps them find the products, brands, features, and contents that they care about.

Visit our demo to see all available previews: Click here.

---

How to set up sections for Search Page?

1. From your Shopify admin, go to Online Store -> Themes.

2. Find the theme that you want to edit, and then click Customize.

3. Choose Others from the dropdown window -> Choose Search.

4. From the side menu, select Search results. Configure the search page in the setting on the side with the following settings.

Setting	Description
Number of columns on desktop	The number of products from the (collection or products) to display on desktop. Must be an even number. Minimum: 1. Maximum: 6.

Product card

Setting	Description
Image ratio	Determines the ratio between the image's width and height. Select image ratio from the dropdown menu: Adapt to image Portrait Square
Image shape	Display image type: Default Arch Blob Chevron left Chevron right Diamond Parallelogram Round Standard-styled cards have no borders when an image shape is active.
Show second image on hover	When the customer hovers their cursor over the product image, displays the second product image if the product has one.
Show vendor	Display as a section vendor.
Show product rating	Display as a section rating. To display a rating, add a product rating app.

Filtering

Setting	Description
Enable filtering	Enable/disable checkbox. Customize filters with the Search & Discovery app. Learn more
Desktop filter layout	Select the filter layout style for the section: Horizontal Vertical Drawer (Drawer is the default mobile layout)
Input option name to show swatch style	Fill in the field with the same name of product variant to show swatch style.

Toolbar

Setting	Description
Enable toolbar	Enable/disable checkbox
Enable sorting	Enable/disable checkbox

Blog card

Blog card styles also apply to page cards in search results. To change card styles update your theme settings.

Setting	Description
Show date	Enable/disable checkbox
Show author	Enable/disable checkbox

Mobile Layout

Setting	Description
Number of columns on mobile	Select the number of columns to display on mobile devices from the dropdown menu: 1 Column 2 Column

Section padding

Setting	Description
Top padding	Determines the height of the top inner space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).
Bottom padding	Determines the height of the bottom inner space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel).