Search

The Search results page displays products and pages that match the wording request added to the Search field.

Tip: To edit the page, choose Others in the top drop-down and navigate to the Search template. Then, press the "Search results" section.

Search results

Product card

The "Image ratio" can be changed from "Adapt to image" to "Portrait", "Square", "Landscape", or "Circle".

Enable or disable each option described below to decide the necessary options on the Search results page:

The second image of a product will be displayed on hover over the main image with the ticked "Show second image on hover" option.

If you need to add an extra space between images, enable "Add image padding".

To display a brand for each product, tick the "Show vendor" option.

Filtering and Sorting

If you need to store filters on the Search results page, tick "Enable filtering". The theme uses Shopify's storefront filtering. To customize filters, go to Shopify admin -> Online Store -> Navigation -> Collection and search filters. Here you can use the Shopify search & Discovery app. Learn more about filters here.

Default filter state

Use the provided drop-down to arrange the default state of filters in the sidebar. Choose if to display filters "All open", "First open", or "All close".

The sorting order drop-down will be displayed on a page if you tick "Enable sorting". The sorting order of each collection depends on the settings you set in Shopify admin -> Products -> Collections. The step-by-step instructions on how to customize the sorting order in your admin, you can find in the initial documentation.

Max filters in column

This option allows handling the visible number of filter items displayed in one column. Set the limit for the number of items displayed in a column on a scale from 0 to 25. If you have more items as you arranged on the scale, the button "More type" will be added to view the remaining filter items from this category:

Here is how the filtering and sorting features might display on the page:

Options for type "Round colors"

If you need to display color variants as round colors instead of the color list, paste the product variant names to the input field (for example "Color"). If you use more than one product option name for various products in your admin (for example "Color", "Pattern", "Material", etc.), insert each option name to the "Options for type "Round colors" input field using the line break as a separator.

Price layout

To change the price layout, choose one of the options in the drop-down: "Slider and inputs", "Slider", or "Inputs". The settings can be applied to the desktop only.

Show price slider coins

Note! The coins will be displayed in the price slider if you allowed decimals in your Shopify admin -> Settings -> Store details -> Store currency. There you can edit the Currency formatting by pressing the button "Change formatting".

This functionality works for the Price layouts: "Slider and inputs" or "Slider".

In the drop-down, one can choose whether to use decimal numbers for the price or display only the integers in the slider using the options: "No ($100)" or "Yes ($100.00)". To display the fractional part of the price after the decimal point, use the "Yes ($100.00)" option.

Price slider step

Control the step of the price slider using one of the suggested options. The drop-down includes the list of values to change the step from 1 to 100, such as 1, 2, 5, 10, 20, 50, and 100.

Enable sticky sidebar

Activate the option to showcase the filters sidebar when scrolling down to the bottom of the product grid section.

Blog Card

These settings will be applied to the blog posts only.

Control showing date and author by enabling or disabling "Show date" and "Show author":

In the following examples, you can view how the page might display in a store:

Last updated