Badges and Promotional Tags

Frame

Frame allows four types of badges on the product card: Sold out, Sale, Final sale, and New

Sold out

The Sold out badge will appear automatically when the product is sold out. Sold out is defined as a product with 0 quantity of all variants and not selling out of stock.

Sale

The Sale badge will appear automatically when a product is on sale. To, you will need to set a compare at a price for the product. To find more information about how to set sale prices, please visit setting sale prices for products.

Final Sale

The Final sale badge will appear when you add the Final Sale tag to a product. To add:

  1. From your Shopify admin, go to Products.
  2. Click the name of a product.
  3. In the Tags section, add a new tag Final Sale.
  4. Click Save.

New

The New badge will appear when you add the New tag to a product. To add:

  1. From your Shopify admin, go to Products.
  2. Click the name of a product.
  3. In the Tags section, add a new tag New.
  4. Click Save.

Honey

Honey offers the ability to add custom promotional tags to products. Promo tags are badges that can be used to promote any aspect or feature of your product you desire.

Promo tags are visible on product cards, product pages, and the Featured product section. All promo tags added will appear on that product's page and, if applicable, the Featured product section. Only the first promo tag will appear on the product's card.

To add or edit a promo tag, navigate to Theme Settings > Badges

  1. Honey offers several default Promo tags including Selling Fast, Just In, Most Wished, Exclusive, Final Sale, and Monogrammable and their corresponding icons bolt-lightning, megaphone, wand-magic-sparkles, house-heart, alarm-clock, and reel.
  2. To add your own custom Promo tags, type in the tag name using commas in the Promo Tags field (e.g. Coming Soon, Back In Stock). You can also remove any promo tags from this list.
  3. To add your own custom Promo tag icons, type in the file name of your custom icon in the Promo tag icons field.
    1. Follow the instructions below to create your custom icon.
    2. Upload the icon to Content > Files.
    3. Each promo tag name and icon must be in the same order to work properly (e.g. icon_coming_soon, icon_back_in_stock). PNG required.
  4. Click Save.
  5. On the Shopify Admin, go to the product you want to display promo tags on.
  6. Find the Product organization block and in the Tag field add the promo tags that you previously added to the Promo tags field.

  7. Click Save.

Note: If a product has more than one promo tag applied, only the first promo tag will be visible on the product card. The promo tag order depends on the order in the Promo tags fields.


Adding a custom icon

If you want to display a custom icon you can add a custom image to your Shopify files:

  1. Create a PNG image file with your custom icon on a transparent background. We recommend images with a minimum size of 32 x 32px. We also recommend using a name that you can identify later, for example, if the icon is for a new custom tag 'Coming Soon' we recommend naming the file icon_coming_soon.png

    Note: Make sure the color of the icon has proper contrast with the background of the promo tag.

  2. On the Shopify Admin, go to Content > Files.
  3. Click Upload files and add all icon image files.
  4. On Theme editor, go to Theme Settings > Badges.
  5. In the Promo tag icons field, add the icon file names without the .png extension. For example, you would type icon_coming_soon to reference your file icon_coming_soon.png
    1. Please note, you must add the tag names and icon file names in the same order to properly associate each icon with its corresponding name.
  6. Click Save.

Note: 'Sold Out' and 'Sale' badges will be always visible and don't need any setup. 'Sold Out' will be visible for products with 0 quantity and 'Sale' will be visible when a product has a 'Compare at' price.


Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us