Are you using a version of Influence or Momentum purchased before May 2024? If so, you need to follow this guide.

You can now add custom-worded badges to your product card images to help promote your products such as 'Limited offer' or 'Bestseller'. This guide will walk you through the process of creating and displaying these custom badges.

Steps to Add Custom Badges

1. Creating a Badge Tag

To add a custom badge to a product, you need to create a tag for the product.

To add a tag to your product go to your Admin > Products > Select your chosen products > Product organization > Tags

The tag should follow this format:

_badge: [custom wording]

Example:

_badge: New Arrival

2. Displaying the Badge

Once the tag is added, only the custom wording you specified will be displayed as a badge on the product card.

3. Badge Color Settings

Custom badges will use the custom badge color setting which can be found by going to Admin > Sales channels > Online store > Themes > Customise > Theme settings > Colors > Badges > Custom badge background.

Badge Priority

Custom badges will display in the following priority order:

1. Sold Out
2. Custom Badges
3. On Sale

This ensures that "Sold Out" badges take precedence over custom badges, which in turn take precedence over "On Sale" badges.

If a product is both on sale and has a custom badge for "Limited Edition," the custom badge will display instead of the "On Sale" badge.

Momentum/Influence

Part 1: Defining a badge metafield

To add custom badges, you must first create a define product metafield. To do this:

Step 1: Within your Shopify admin, go to Settings.

Step 2: Click on Custom data, then proceed to Products.

Step 3: Click Add definition.

Step 4: In the Namespace and key field, enter: badges.myCustomBadge

'badges' is the namespace and 'myCustomBadge' is the key. You can change the key if you wish but the namespace must remain as badges.

Tip: Copy your key and save it for a later step. 

Step 5: Enter a Name and Description for your metafield. This is for your reference only.

Step 6: Click the Select type field and choose Single line text.

Step 7: Keep One value selected and Save your metafield.

Note: You can define additional metafields using different key names to display multiple custom badges on a single product. However, the namespace must always be the same.

Part 2: Assigning metafields to your products

You can now add your custom badge text to products. This will essentially link the metafield you created to specific products so custom badges can be displayed on your storefront.

Step 1: Within your Shopify settings, go to Products.

Step 2: Select the product that you want to add the custom badge to.

Step 3: Scroll down to the Metafields section.

Step 4: Locate the metafield you defined above and enter the text you want to appear in the badge.

Step 5: Click Save and repeat with all relevant products.

Note: You don't need to use the same text for each product's custom badge. Each product's badge can be unique. This dynamic content is made possible through the metafield key, which is needed in the next part.

Part 3: Setting up product badges on your store

Next, add your custom product badges to your theme. 

Step 1: Within the Sections menu of the Theme Editor, scroll down to Overlay Group.

Step 2: Under Custom badges, click Add block and then Custom badge.

Step 3: Within the block's settings, paste the metafield key for your custom badge into the Metafield key field.

Note: It may not appear accurate in the preview window. However, if you follow these steps, the badge should display correctly when you view products on your store.

Step 4 (optional): Choose a color scheme.

Step 5: Click Save. Your custom badge will now show on the product images you assigned.

Part 4: Prioritizing your badges

You can limit the number of badges shown on your products, as well as the order in which they appear by editing the Product badges settings.

Step 1: Within the Theme Editor, click on Product badges and set the maximum number you want to display at once.

Example of two badges:

Step 2: The order of the badge blocks dictates the order in which they will appear on your products. Simply, reorder these blocks, top to bottom, to ensure your badges are shown in your preferred order.

Example of prioritizing the custom badge: