Search
The Search results page displays products and pages that match the wording request added to the Search field.
Tip: To edit the page, 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
Enable product suggestions
This option should be enabled to showcase the list of available products in the popup below the search box by entering a search term into the search input field. The product suggestions work on both desktop and mobile devices. Read more about Product suggestions in the following documentation.
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 -> Apps. 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 customizing the sorting order in your admin can be found 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 be displayed 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.
Hide cents in price slider
Note! The coins will be displayed in the price slider if you set decimals in your Shopify admin -> Settings -> General -> Store defaults. There you can edit the Currency formatting by pressing the three dots [...], then the button "Change currency formatting".
This functionality works for the Price layouts: "Slider and inputs" or "Slider".
Using this option, one can choose whether to use decimal numbers for the price or display only the integers in the slider. To display the fractional part of the price after the decimal point, turn off the 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 be displayed in a store:
Last updated