Smart Search Recommendation: Customizing Search Recommendations Display
The Display Settings in the Smart Search Recommendation app enables you to control how product recommendations appear at different stages of a customer’s search journey—before, during, and after a search is performed. By tailoring the display of recommendations, you can enhance the overall shopping experience, reduce bounce rates, and boost conversions.
In this article, you’ll learn how to customize the appearance and behavior of search recommendations to support your customers' search experience better.
How to Access Display Settings
To access the Display Settings section:
-
From your SHOPLINE admin panel, go to Apps > Smart Search Recommendations.
-
In the top menu, click Display settings.
- You’ll be taken to the settings page, where you can customize each stage of the customer’s search journey:
- Pre-search recommendations (Before search): Set what customers see before they begin typing, such as trending keywords or popular products.
- Search recommendations (During search): Adjust how keyword suggestions and product matches appear in real time as users type.
- Results page (After search): Configure the layout and behavior of the search results page, including content types displayed and sorting logic.
Customizing Pre-search Recommendations (Before Search)
The Pre-search recommendations section lets you customize what customers see before entering any keywords in the search bar. By adjusting the placeholder text, preset suggestions, and recommended products, you can guide users toward popular searches and featured items, helping to increase engagement right from the start. The available options are explained below.
| Note: To properly display the pre-search recommendation settings on the storefront, make sure Page content display is enabled in the Layout style settings. |
Background Terms
You can configure what placeholder text appears in the search bar before users start typing:
-
Custom text: Displays a static message such as "Enter here and click search (default text)."
Note: To modify the text, use the Multi-Language Translator app. - AI-powered auto-scrolling terms: Dynamically rotates trending or commonly searched keywords to inspire user searches.
Search History
Enable this option to show a user’s previous search terms before they start typing. This feature is disabled by default, but you can enable it and customize the header text using the Multi-Language Translator app.
Preset Recommended Content
This section allows you to manage the search terms and products shown under Hot search and Hot sales before users begin searching.
-
Recommended terms/Product titles: The default section titles are Hot search (for keywords) and Hot sales (for products).
Note: You can customize the header text using the Multi-Language Translator app. - Recommended content settings: Choose how keywords and products are displayed before a search:
-
- AI-based recommendations: Automatically suggests keywords and products based on user behavior and trends.
-
Manual configuration: Manually select which keywords and products to feature:
- Preset recommended term: Click + Add preset recommended term to add up to 10 predefined keywords.
- Default recommended products: Click + Add preset product to add up to 10 recommended products.
-
Multi-Market Settings: If you operate in multiple markets, you can tailor recommendations by region:
-
To add markets: Click the + icon next to Recommendations, select the countries or regions, and click Add. You can then set market-specific terms and products.
-
To delete markets: Click Manage next to Supports separate configurations for multi-markets. In the pop-up, click the trash icon to remove a region.
-
You can preview your settings in the right panel and switch between desktop and mobile views. When you're done, click Update to save your changes.
Customizing Search Recommendations (During Search)
The Search recommendations section lets you control what appears as customers type in the search bar. This helps deliver relevant recommendations in real time, enhancing product discovery and improving the overall search experience.
| Note: To properly display the search recommendation settings on the storefront, make sure Page content display is enabled in the Layout style settings. |
AI Smart Recommendations
When enabling Activate AI Smart Recommendations, the system uses user input to recommend keywords and products, improving search accuracy and engagement. By enabling this feature, you agree to SHOPLINE’s Privacy Policy.
Display Content
Choose the types of content to display in live search results. The following options are available and can be reordered using drag-and-drop:
| Note: To customize the default header text (e.g., "Products," "Collections"), use the Multi-Language Translator app. |
- Products
- Pages
- Blog posts
- Collections
If you’ve selected Products as one of the display content types, you can further configure how products are recommended in the Product Recommendation Mode section.
Product Recommendation Mode
If Products is selected as a content type (in the previous step), you can choose how recommended products are generated and displayed in the search dropdown. The system provides two modes:
|
Notes:
|
- AI Keyword Expansion: The AI algorithm dynamically expands search keywords and recommends high-conversion products based on factors such as AI-inferred relevance, bestselling items, and browsing history. For example, when a user enters "dress", the AI automatically expands it into related search terms like "mini dress", "backless dress", and "one shoulder dress", helping surface products that better match the user’s interests during the search process.
- Search Preview: The system displays recommended products directly from the search results, following the rules set in the Search Settings. Results are fully consistent with the search results page for predictable, rule-based output.
Display Layout
Choose how search recommendations are displayed:
- Single page display: All content types are shown in a continuous list.
- Tabbed display: Content types are separated into tabs, allowing users to switch between them.
You can preview your settings in the right-hand panel and switch between desktop and mobile views. When you’re satisfied, click Update to save your changes.
Customizing Search Results (After Search)
The Results page section lets you configure how search results appear after a user performs a search. You can choose which content types to display, set up filters, and define sorting rules to help customers find what they need quickly.
Search Box
Decide where the search box appears and activate Search Discovery to improve the post-search experience:
- Search results page: Enable to show a fixed search box on the search results page.
- Category product page: Enable to show a fixed search box on category-specific product listing pages.
- Search Discovery: For both of the above, enable this feature to display search suggestions when users click the search box.
Display Content
Select which content types appear on the search results page:
| Note: This feature applies only to Theme 2.0, 2.1, and 3.0. |
- Products (enabled by default)
- Blog posts
- Custom pages
- Collections
Filter
Set up filters to help users narrow down search results. Configure filter options and display styles in the Filter tab.
Sort
Customize how products are ordered on the results page. Set the sorting rules and label text in the Custom sorting tab.
You can preview your settings in the right-hand panel and switch between desktop and mobile views. When you’re satisfied, click Update to save your changes.
Configuring the Layout Style
Click the Layout Style button in the upper-right corner to customize the layout template and product card display, helping you improve the visual appeal of your search recommendation results.
- Page Content Display: Enable this option to properly display settings from Pre-search Recommendations (before search) and Search Recommendations (during search). If disabled, the display will follow your theme’s default styling.
- Layout Template: Click Change to select a layout template that best fits your search recommendation display. Four templates are currently available.
- Product Card Settings: Customize how product cards appear in search recommendations. Available options include product image ratio, fill method, title display, and information display.
When you have finished configuring your settings, click Update to save your changes.