Setting up Product Labels in Instant Search Widget on Shopify

The Product Labels feature allows you to show eye-catching labels for products in search results.

Below is an example of Discount Labels and In-stock Labels in the Instant Search Widget:

Setting up Product Labels in Instant Search Widget on Shopify

In this article, you learn how to adjust product labels in the Instant Search Widget. To do so in the Search Results Widget, look for the instructions here.

Discount Labels

You can add Discount Labels to products sold with discounts in the Instant Search Widget. See the example above.

To do so, follow these steps:

Important info

Discount label overrides the Show compare at price option (Instant search widget section > Content tab > Products part) which allows showing original product price compared with discount product price.

  1. Go to the Smart Search & Filter control panel > Instant search widget section > Product Labels tab > Discount label part.
  2. Switch on the Discount Label setting.
  3. Optionally, change the background color and the icon color (text color) of the discount label.
  4. Optionally, change the text of the Discount Label. If you enter the [discount] parameter in the text box, it will be replaced with the actual product discount.
  5. Apply the changes.

In-stock Labels

You can add In-stock Labels to products in the Instant Search Widget to show their availability to customers: in-stock, pre-order, out-of-stock. See the example above.

To do so, follow these steps:

  1. Go to the Smart Search & Filter control panel > Instant search widget section > Product Labels tab > In-stock label part.
  2. Switch on the In-stock Label setting.
  3. Optionally, change the background color and the icon color (text color) of the labels.
  4. Optionally, change the text of the labels.
  5. Apply the changes.

Labels by Tags

You can set up custom labels for products based on their tags to highlight certain products in search results.

Adding labels

Steps:

  1. Go to the Smart Search & Filter control panel > Instant search widget section > Product Labels tab > Labels by tag part.
  2. Click the + New label button.
  3. Set up the label options:
    1. Product tag – enter a product tag into the text box.
    2. Text – enter a text which will be displayed as the label.
    3. Background color – enter or select the background color of the label.
    4. Text color – enter or select the text color of the label.
  4. Click the Save label button in the top-right corner.
Setting up Product Labels in Instant Search Widget on Shopify

That’s it. The label by tag has been added and is now displayed in the Instant Search Widget.

Setting up Product Labels in Instant Search Widget on Shopify

Editing labels

Steps:

  1. Go to the Smart Search & Filter control panel > Instant search widget section > Product Labels tab > Labels by tag part.
  2. Click the Edit link next to the label you want to edit.
  3. Edit the label options.
  4. Click the Save label button in the top-right corner.

Deleting labels

Steps:

  1. Go to the Smart Search & Filter control panel > Instant search widget section > Product Labels tab > Labels by tag part.
  2. Select the label(-s) you want to delete.
  3. Click the Delete selected button.
  4. Confirm.

Product Labels can be customized further with the help of the Custom CSS feature. In case you need help with that, feel free to contact us. Our support team will gladly help customize them the way you want.

Enjoying your experience with Searchanise?

We’d appreciate it if you could take some time to leave a review.

Updated on July 20, 2022

Was this article helpful?

Related Articles

Need Support?
Can't find the answer you're looking for?
Contact Support
Back to top