The Search settings in Concept let you control how customers search your store from the header search icon, Mobile Dock, and search area.
In Theme settings > Search, the Search type setting can be used to choose how the search interface appears on the storefront.
Concept supports three main search types:
| Search type | How it works |
|---|---|
| Search page | Sends customers to the full search results page. |
| Search drawer | Opens the search field inside a slide-out drawer. |
| Search inline | Displays the search field inline, usually directly in the header area instead of opening a drawer. |
How to Configure Search Types in Concept
Steps:
Open the Search settings
-
From your Shopify admin, open Online Store > Themes.
-
Click Customize on your Concept theme.
-
Click the Theme settings icon.
-
Open Search.
-
Make sure Enable search is turned on.
-
Find the Search type setting.
-
Choose the search layout you want to use.
- Click Save.
Search page
-
Select Search page if you want customers to open the full search results page after submitting a search term.
-
This option uses the store search page and the search results template.
-
Customers can view a full list of matching products, collections, pages, and articles.
-
This option is useful when you want a simple search behavior without opening a drawer or showing an inline search field.
-
The header search icon will direct customers to the search page or submit the search to the search page.
Search drawer
-
Select Search drawer if you want the search field to open in a slide-out drawer.
-
This option lets customers start searching without leaving the current page.
-
The search drawer can be opened from the header search icon.
-
It can also be opened from the Search item in the Mobile Dock if the Mobile Dock includes a search item.
-
Make sure the Search drawer section is added to the Overlay group.
-
The drawer can display search recommendations before customers type a keyword.
-
If predictive search is enabled, live results can appear inside the drawer while customers type.
You may want to check this this article to see how to set up the Search drawer.
Search inline
-
Select Search inline if you want the search field to appear directly on the storefront instead of opening inside a drawer.
-
This option is commonly used when you want the search bar to be more visible and easier to access.
-
The search field can appear inline in the header area, depending on the header layout and available space.
-
Customers can click or type directly into the inline search field.
-
If predictive search is enabled, live results can appear from the inline search field while customers type.
-
This option is useful for stores where search is an important shopping action, such as stores with large catalogs.
Enable predictive search
-
Open Theme settings > Search.
-
Enable Predictive search.
-
Use Maximum results to show to control how many results appear while customers type.
-
Enable Show product vendor if you want vendor names to appear in predictive product results.
-
Enable Show product price if you want product prices to appear in predictive product results.
-
Click Save.
Predictive search can work with the selected search type. For example, it can show live results inside the search drawer or from the inline search field.
Add search recommendations
-
Open Theme settings > Search.
-
Find Search recommendation.
-
Select a menu that contains the links you want to show before customers type a search term.
-
Use this menu for popular searches, important collections, help pages, or featured links.
-
Click Save.
Search recommendations can appear before live predictive results are displayed.
Enable the typewriter effect
-
Open Theme settings > Search.
-
Enable Typewriter effect.
-
Add the starter text in Search starter text.
-
Click Save.
The typewriter effect adds animated starter text to the search input before customers begin typing.
Choosing the right search type
| Goal | Recommended search type |
|---|---|
| Use a simple search flow | Search page |
| Let customers search without leaving the current page | Search drawer |
| Make the search field always more visible | Search inline |
| Show live results while typing | Enable Predictive search together with your selected search type |
Troubleshooting
If the search icon or search field does not appear, make sure Enable search is turned on in Theme settings > Search.
If the Search drawer does not open, make sure Search drawer is selected as the Search type and that the Search drawer section exists in the Overlay group.
If Search inline does not appear as expected, check your header layout and make sure there is enough space for the inline search field.
If predictive results do not appear, make sure Predictive search is enabled.
If product prices or vendors do not appear in predictive results, check the Show product price and Show product vendor settings.
If search recommendations do not appear, make sure a menu is selected in Search recommendation and that the menu contains links.
Need Further Assistance
If you encounter any issues or need additional help with your Concept theme, please reach out to our support team via our Ticket System for assistance within 8 hours.
بانٹیں:
How to Set Up the Search Drawer in Concept
How to Set Up the Video with Text Overlay Section in Concept