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
Enable product suggestions
This option should be enabled to show the list of available products in the pop-up below the search box after entering a search query into the search input field. The product suggestions work on both desktop and mobile devices. Read more about Product suggestions in the following documentation.
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:
If you need to add extra space between images, enable "Add image padding".
The second image of a product will be displayed when the cursor is placed over the main image after enabling the "Show second image on hover" option.
To display a brand for each product, tick the "Show vendor" option.
Sorting
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.
Filtering
If you need to store filters on the Search results page, tick "Enable filtering". The theme uses Shopify's storefront filtering. To customize filters, navigate to Shopify admin -> Apps. Here, you can use the Shopify search & Discovery app. Learn more about filters here.
Enable sticky sidebar
Activate the option to showcase the filters sidebar when scrolling down to the bottom of the product grid section.
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".
Enable filters column limit
Switch on the option to reveal the filter limit settings below.
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 than 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:
Swatches
Enable option tooltip
Use the option to display a product variant name when the cursor is placed over it. The option will be applied to product cards throughout the store. Define the shape of the tooltips using the "Tooltip" in Theme settings -> Styles.
Options for type "Round color"
If you need to display color variants as round colors instead of the color list, paste the product variant names into 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 into the "Options for type "Round color" input field using the line break as a separator.
Options for type "Rectagular picture"
To display option values as rectangular colors/pictures, paste the option names into the provided input field. Separate each new product option with a comma.
Price filter
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 only be applied to the desktop.
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.
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 "Change currency formatting" button.
This functionality works for the Price layouts: "Slider and inputs" or "Slider".
Tick the checkbox to deactivate decimal numbers for the price so only the integers can be shown in the slide. To display the fractional part of the price after the decimal point, untick the option.
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