Customize Sales Icons & Clock

Overview

Bold Discounts offers a sales clock and sales icon to display on your product pages. The clock will only show for sales that have an end date, which the sales icons will only appear on product pages and collection pages for products that are being discounted in the Discounts app. 

Visit Create a Discount with Bold Discounts for steps on creating a discount with an end date. 

Note: The sales icon and clock will not appear until the liquid code installation has been completed on your theme.



Customize the Sales Clock


To customize the sales clock display in Discounts, please follow these steps:

  1. From within Discounts, select Sales Clock.
  2. Change the Sales Clock Type (optional).
  3. Changes the Sales Clock Style (optional).
  4. Enter any Custom CSS as desired (optional).

    Note: Visit W3 Schools - CSS for more information on CSS styling.

    Add Custom CSS

  5. Select Save.


Change Sales Icon

To change the sales icon in Discounts, please follow these steps:

  1. From within Discounts, select Sales Icon.
  2. Select a new sales icon.
  3. Select Save.


Use Custom Sales Icon

To use a custom sales icon, please follow these steps:

  1. From Shopify's admin, select Settings.
  2. Select Files.
  3. Select Upload files.
  4. Select your custom icon.
  5. Select Open.
  6. Copy the URL to the image.
  7. Duplicate themes, to create a backup copy.
  8. From Shopify's admin, select Online Store.
  9. Select Actions.
  10. Select Edit code.
  11. Under "Snippets", select shappify-sales-icon-product.liquid.
  12. Copy and paste the URL in the img src.

    Copy and paste file URL for product image

  13. Select Save.
  14. Under "Snippets", select shappify-sales-icon-collection.liquid.
  15. Copy and paste the URL from step 6 in the img src.

    Copy and paste file URL for collection image

  16. Select Save.
  17. If you would like to replace the image with text, replace the entire image code with:
    <p>This Item is on Sale!</p>

    You can change the text to any verbiage you wish to display.

    Place image with text

Was this article helpful?
0 out of 0 found this helpful