Start Strong
Sell Smart
Manage with Ease
Market to Success

Smart Search Recommendation: Customizing "No Results Found" Recommendation Display Settings

When a customer's search returns no results, the Recommended products for 'No Results Found' page feature automatically displays alternative products, helping customers keep browsing and improving conversion. You can customize how these recommended products are displayed on your online store, including the heading, product list layout, product image, product title, price, and discount badge, so the display matches your store's overall look.

This guide covers the prerequisites for using this feature, explains how to access and enable the related settings, and walks through each display setting and its effect.

 

 

Prerequisites for Using the ‘No Results Found’ Recommendation Display Settings

Before customizing the display settings, confirm the following:

  • Your store must use a SHOPLINE OS 2.1 or later theme to use the display customization options described in this guide.
Note: If your store uses a SHOPLINE OS 2.0 or earlier theme, recommended products still display on the ‘No Results Found’ page, but in a fixed system style. Customization isn't supported.

 

 

Accessing the ‘No Results Found’ Recommendation Display Settings

To access the display settings page:

  1. In your SHOPLINE admin panel, go to Apps > Smart Search Recommendations > Search configurations.
  2. Locate the Recommended products for 'No Results Found' page card. The card shows its current status as Activated or Deactivated.

  3. Click Settings on the card to open the display settings page.

 

 

Enabling the ‘No Results Found’ Recommendation Feature

The first time you use this feature, complete the authorization and activation steps at the top of the settings page:

  1. Check Before you start please accept the privacy agreement, after reviewing the details via View Privacy Policy.

  2. Toggle Activate to turn on the feature for your store.

Note: Recommended products on the ‘No Results Found’ page are generated automatically by the system based on customer profiles and browsing behavior. You can't manually select or configure which products are recommended — only their display style.

 

 

Customizing the Display Style for ‘No Results Found’ Recommended Products

Once the feature is enabled, you can customize the following display settings. A live preview on the right updates as you adjust each setting.

 

Customizing the Heading Alignment

In the Heading section, you can set the alignment of the heading:

  • Alignment: Choose how the heading is aligned. Options include Align left, Align center (default), and Align right.
Note: The heading text (for example, "Recommended for you") is fixed system copy and is automatically translated based on your storefront language. It can't be customized.

 

Customizing the Product List Layout

In the Product list section, you can set how many recommended products display per row on different devices:

  • Desktop columns: Set the number of products shown per row on desktop. Range: 1–5 (default: 4).
  • Mobile columns: Set the number of products shown per row on mobile. Range: 1–2 (default: 2).

 

Customizing the Product Image Aspect Ratio and Fit

In the Product image section, you can set how recommended product images are displayed:

  • Aspect ratio: Choose the display ratio for product images. Options include 1:1 (default), 2:3, 3:4, and 4:3.
  • Image fit: Choose how the image fills its frame. Options include Cover (default) and Contain.

 

Customizing the Product Image Border

In the Product image border section, you can customize the corner radius, thickness, and opacity of the image border:

  • Radius: Set the border's corner radius. Range: 0–40px (default: 0).
  • Thickness: Set the border's thickness. Range: 0–12px (default: 0).
  • Opacity: Set the border's opacity. Range: 0–100% (default: 0).

 

Customizing the Number of Product Title Lines

In the Product title section, you can set the product title display separately for desktop and mobile:

  • Show on desktop: Turn the product title on or off on desktop (default: on).
    • Desktop max lines: With Show on desktop turned on, set how many lines the title displays. Options include Show 1 line (default), Show 2 lines, and Show full text.
  • Show on mobile: Turn the product title on or off on mobile (default: on).
    • Mobile max lines: With Show on mobile turned on, set how many lines the title displays. Options include Show 1 line (default), Show 2 lines, and Show full text.

 

Enabling the Quick Add Button

In the Quick add section, you can enable quick-add for recommended products:

  • Enable to show quick add button: When turned on, customers can add a recommended product to their cart directly from the product card, without opening the product detail page (default: on).
Note: The quick add button is only available on SHOPLINE OS 2.1 and later store themes.

 

Customizing the Product Price Display

In the Product price section, you can set how recommended product prices are displayed:

  • Show price: Turn the product's selling price on or off (default: on).
    • Price format: With Show price turned on, set the price display format. Options include Lowest price, From lowest price (default), and Price range.
    • Show compare at price: Turn the product's compare-at (original) price on or off (default: on).
Note: The compare-at price only actually displays on the recommended product card when the selling price is lower than the compare-at price. If the two are equal or the selling price is higher, the compare-at price won't display, even with Show compare at price turned on.

 

Customizing the Discount Badge Display

In the Discount badge section, you can set how the discount badge displays for qualifying products:

  • Show discount badge: Turn the discount badge on or off (default: off).
    • Badge type: With Show discount badge turned on, set the badge type. Options include Sale badge and Save badge (default).
    • Data format: When Badge type is set to Save badge, set the data format shown on the badge. Options include Discount amount (default) and Discount percentage.
    • Radius: Set the discount badge's corner radius. Range: 0–40px (default: 0).
Note: The discount badge only displays when the product's selling price is lower than its compare-at price. If the calculated discount rounds to 0% under Discount percentage, the system automatically hides the discount badge for that product.

 

 

Previewing and Saving Your ‘No Results Found’ Recommendation Display Settings

Once you've finished customizing the display settings, you can preview the result before saving:

  1. In the preview panel on the right side of the settings page, switch between Desktop and Mobile view to check how your current settings display.

  2. Once you're satisfied with the preview, click Update to save your settings.
Note: The preview is for reference only. Check your online store after updating to confirm the actual display.