Theme settings: Display product grid labels
OS 2.0 themes
This article will cover the setup and customization options for labels on various product grids when using the Creative theme.
The Creative theme has the ability to display up to five different product labels on product grids such as collection pages and home page collections.
Any or all of the following labels can be displayed:
- Sold out labels
- Discount labels
- Time based 'New' labels
- Custom labels 1
- Custom labels 2
All five labels are enabled by default. The following article will explain how to display and modify Product grid labels.
Customize the appearance of all labels
- To display multiple labels horizontally click Display labels inline.
- To display labels on the right of the image click Position labels right.
- To change the background color opacity of the labels adjust the Label background opacity slider.
Lastly, save your work and then check that all is working as expected.
The label text color will automatically switch between black and white depending on the label background color to provide sufficient contrast.
Sold out label options
- If a product is sold out all other labels will be disabled by default - in order to keep the design less cluttered. To display all your labels untick the 'Hide other labels if sold out' checkbox.
If you want to use a different term than 'Sold Out' you can change the text in the languages area of your theme - please see the article linked at the bottom of this page
Discount label options
- Discount labels can be displayed in three formats: Text, Currency (e.g. 'Save $50.00'), and Percentage (e.g. 'Save 20%'). You can use the Discount format dropdown to select one of these formats.
If you want to use a different term than 'On sale' for Text, or 'Save' for Currency and Percentage you can change the text in the languages area of your theme - please see the article linked at the bottom of this page
New label options
- You can decide how long a product is considered 'New' i.e if every time you add a new product to your store you'd like it to display a 'New' label for two weeks, move the period slider to 14days. After 14 days the label will be automatically removed.
- The New label text field is used to add the custom word(s) you want to appear in your New labels. It's best to keep these as short as possible as too many or very long words might overlap a lot of your product image. If you leave this text box empty this feature will be disabled.
Custom label options
Custom label text is a powerful way to promote certain aspects of your products to customers, such as 'Organic' or 'Bestseller'.
- The Custom label collection picker can be used to select which collection of products on your store you wish to display custom labels on. A powerful way to do this might be to set up an automated collection based on certain conditions.
- The Custom label text text box is used to add the custom word(s) you want to appear in your Custom labels. It's best to keep these as short as possible as too many or very long words might overlap a lot of your product image. If you leave this text box empty this feature will be disabled.