Select your platform

Customize Sales Icons & Clock in Bold Discounts

Laurel
Laurel
  • Updated

Bold Discounts offers a sales clock and sales icon to display on your product pages. The clock appears on products that have an end date set in Bold Discounts, and the sales icons appears 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.

To have the sales icon or clock appear on your theme, you will need to have the liquid code installed. For more information, please visit Bold Discounts Install Instructions.

 


 

Customize the Sales Clock

  1. From within Discounts, select Sales Clock.
  2. Optional: Change the Sales Clock Type.
  3. Optional: Change the Sales Clock Style.
  4. Optional: Enter any Custom CSS as desired.

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

    Add Custom CSS

  5. Select Save.

 


 

Change the Sales Icon

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

 


 

Use a Custom Sales Icon

  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 link 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 link 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 link 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

 


 

Translate the Sales Clock From English

Discounts allows you to translate the sales clock verbiage into another language to display on your storefront.

Note The clock can only be translated into one language at a time.

To translate the sales clock from English on your theme, please follow these steps:

  1. Duplicate themes, to create a backup copy.
  2. From Shopify's admin, select Online Store.
  3. Select Actions.
  4. Select Edit code.
  5. Under "Layout", select theme.liquid.
  6. Copy and paste the code below between the head and /head tags
    1. <script>
      function shappify_overwrite_sales_clock_text() {
      shappify_sale_over_label = "Sale Over";
      shappify_sale_ends_in_label = "Sale ends in";
      shappify_day_label = "day";
      shappify_days_label = "days";
      shappify_hour_label = "hour";
      shappify_hours_label = "hours";
      shappify_minute_label = "minute";
      shappify_minutes_label = "minutes";
      shappify_second_label = "second";
      shappify_seconds_label = "seconds";
      }
      </script>

    Image of code added

  7. Change the text in quotes to the desired translation.

    Text in quotes

  8. Select Save.

This method may not work with languages using special characters.