Optimizing the search component style and enabling hot word recommendations helps highlight your search bar and present relevant keyword suggestions. This enhances the shopping experience by making products easier to find and improving the visibility of popular search terms or recommended search terms.
Configuring the search component style
Follow the steps below to configure the search component style in your Shoplazza admin:
1. Open Smart Product Search: From your Shoplazza admin, go to Apps > Smart Product Search to open the app. If the app is not yet installed, click here to install it .
2. Go to the Search Terms section: Switch to the Search Terms tab and click Configure Search Component Style to modify the style of the search component.
3. Configure the search component style: Click Configure Search Component Style to select the display style of your search component. You can choose between:
- Search box style: Shows a full input bar for entering keywords.
- Icon style: Displays a minimal search icon that expands when clicked.
Customizing search component colors
You can customize the text and button colors of the Smart Product Search component directly through your theme editor.
1. Access theme color settings: From your Shoplazza admin, go to Online Store > Themes and click Customize on the theme you want to update, then open Theme settings > Color.
2. Change the header text color: Under the Header section, modify the Header text color to apply changes to the search input, icon, and button.
Note
The options for Search field background, Search field text, Search button background, and Search button text apply only to the theme’s default search feature. These do not affect the Smart Product Search component.
Displaying hot search terms
Hot words allow you to display relevant keywords directly inside the search bar, helping customers quickly discover trending or recommended products.
1. Open hot word settings: In the Search Terms tab of the Smart Product Search app, click Add hot search terms to enter the hot word setup page.
2. Choose how to display keywords: Select one of the following:
- Select Enable Smart-recommended hot search terms to automatically display system-suggested keywords.
- Or click Add hot search terms to manually enter keywords for your store, which will appear under Preset hot search terms and display on your storefront once Apply to online store is enabled.
Note
Hot search terms (both smart-recommended and presets) will cycle through as rotating suggestions inside the search bar when using the Search box style. If you select Icon style, hot search terms will not be displayed.
For detailed steps on how to create and manage hot search terms, refer to this guide:
Configuring the Smart Product Search component enhances your store’s usability by simplifying product discovery for your customers. With flexible styling options and hot word recommendations, you can improve both the visual consistency and search effectiveness. Customizing colors and keyword displays ensures your search bar remains fully functional and consistent with your store branding.
Comments
Please sign in to leave a comment.