Search
Use the options from the following section to configure the Search feature in your store, predict and show the items in the drop-down for a user's search query placed in the search bar.
Last updated
Use the options from the following section to configure the Search feature in your store, predict and show the items in the drop-down for a user's search query placed in the search bar.
Last updated
Activate the option to display the Search icon or Search bar in the Header.
The menu type of the "Icons menu" determines whether to display the Search icon or Search bar in the Header. To change the menu type, navigate to the Header -> Icons menu.
The theme provides several approaches to the Search configurations based on the "Menu type" selected for the desktop and the search position on mobile:
Search icon
Tip: The header type you chose in Theme settings -> Header and Logo -> Header determines the position of the magnifying glass icon for the Search. It will be displayed either to the left or right of the Logo on desktop view.
By enabling the Search feature in the current section, the Search icon will be displayed in the Header for the:
"Inline" desktop menu type.
"Drawer" option on mobile.
Search popup
Note! The "Search popup" section is required to enable the predictive search popup for the "Inline" menu on the desktop and the "Drawer" option on mobile. Otherwise, visitors will be forwarded to the Search page when hitting the Search icon.
Search bar
By default, the Search bar will be activated for the "Popup" desktop menu type and "Header" position on mobile.
Use one of the options in the "Position on mobile devices" picker to change the Search appearance on mobile:
"Header". If you select the current option, the Search bar will appear beneath the Header.
"Drawer". The Search icon will be placed within the Header using this option.
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.
Show vendor
To display a product vendor above the product title in the popup, enable the option.
Show price
Tick the checkbox to display the product price.
In the following examples, you can view how the settings might display on desktop and mobile:
Ensure to use the Icons menu with the "Popup" menu type in the "Header" section to operate the following functionality.
The "All categories" search drop-down can be helpful in terms of searching for the desired product within the selected product category.
Enable categories select
Activate the option to display the "All categories" button next to the Search bar.
In the "Category" picker, decide whether to assign the suggested category to the product type or vendor.
The list of the predefined product categories can be set using the "Filters" input field. Set the list of categories using commas.
Example: FusionGlobe, HorizonX, NexusWorks, QuantumTech, StellarTech, TechSphere.
Tip: The text of the "All categories" button can be edited in your Shopify admin -> Edit default theme content -> Theme content.
Press the dotted [...] button in the top left corner to navigate to Theme content:
Then, choose the tab "General" and scroll down to the search settings:
