2️⃣ IMAGE BADGE

What is a DECO image badge? 🌸

  • A badge: Any graphic design with the position OUTSIDE PRODUCT IMAGES (e.g. above product title, below the quantity selector, etc)

Ex:

STEP 1: Design

1.1. Select the template

  • Click "Choose from library": Select a pre-designed template in our gallery

  • Click "Upload image": Upload your own design to use as a badge

1.2. Adjust the badge size

You'll have 2 options to adjust the badge size:

  • Same size on all screens:

By dragging this round button, the badge size will be the SAME on ALL DEVICES + PAGES

  • Custom size per screen: You can adjust the size DIFFERENTLY for EACH PAGE + DEVICE

By switching between "Desktop" VS "Mobile" button & "Collection page" VS "Product page" option, you can set up the badge size differently on these screens

1.3. Choose the badge position

Select which position your badge will show up outside the product image:

Then, choose 1 in 3 predefined position

To adjust the position more freely, use: Margin

1.4. Choose the device to display the badge

Tick to choose which devices you want to display the badge on

1.5. Other additional settings for the badge

You can add border, round corner, add animation,... or use CSS code to make your badge look more stunning!

STEP 2: Products 🏷️

(Choose the conditions for your badge to appear)

I - Specific products

Select the products you want to show the badge on manually, and your badge will only display on selected products

II - All products

Just with 1-click, and your label will display on ALL ACTIVE PRODUCTS that are published on your website

III - Conditions

Automatic conditions, which save much of your time

NOTE: Before selecting any conditions, please choose the matching setting first:

  • All conditions: The badge will ONLY APPEAR ON PRODUCTS that SATISFY EVERY SINGLE CONDITION you selected in the app.

  • Any conditions: The badge WILL APPEAR ON PRODUCTS that SATISFY AT LEAST 1 OF THE CONDITIONS you selected in the app.

👉 Example:

Say you select these conditions:

  • Product collection = "Electronics"

  • In stock

🛠️ With "All conditions": A product must be in the Electronics collections AND be in stock to show the badge.

🛠️ With "Any conditions": A product only needs to meet one requirement—it could belong to the collection: Electronics OR be in stock to show the badge.

Basic Conditions

You can set up the weight range, price range & the product title in DECO, and the app will automatically detect & show the badge on products meeting the requirements.

Advanced Conditions

1. Product collections

  • Choose the desired collections; your badge will be displayed on all products belonging to selected collections

2. Product tags

  • Enter the tags of your product from your Shopify store. The badge will then be displayed on any products that have those tags.

3. Discount status

By choosing "Fixed value" or "Value range", your badge will display on all matching products

4. Exclude collections

  • If you select this condition, the badge will not be displayed on any products within the collections you have selected.

5. Exclude tags

  • Products with the entered tag(s) will not display the badge.

6. New status

Set the start and end dates to display the badge on products created within that period.

7. Inventory status

  • Select 1 of those conditions, and your badge will display on matching products

8. Include products

  • If you've selected the "Product collections" condition but want to also display the badge on additional products outside those collections, use this condition to specify them.

9. Exclude products

  • To exclude specific products within selected collections from the badge zdisplay, use this condition.

10. Specific product variants

  • This condition will help you choose which variants you would like to show the badge

11. Add a matching metafield

(This will help connect your PRODUCT METAFIELD with the DECO's BADGE >> Then, show the badge on products with the matching value)

  • First, click on the button "+ Add metafield" to start connecting

  • Next, a list of all product metafields in your store will appear, tick to select >> click "Select" button

  • Then, choose between these 2 options:

Exists: Show on all products that have the metafield value filled in (any value).

Equal to: Show only on products with the exact value entered.

For example:

↪ Exists

  • Metafield key: Plant type

  • Option: Exists

  • Result: The label will show on every product that has any Plant type value (e.g., "Indoor Only", "Outdoor", "Shade Loving", etc.).

↪ Equal to

  • Metafield key: Plant type

  • Option: Equal to

  • Value entered: Indoor Only

  • Result: The label will show only on products with Plant type = Indoor Only.

Besides, if you want to show the value of the metafield on the label, please visit this metafield's common use cases 🥰

STEP 3: DISPLAY 📅

(This is the place to choose which pages you want to display the badge on)

1. Choose pages to display your badge

2. Choose the market to show

You can either select to display the badge on all markets/ only some specific markets

3. Choose the customer country to show

You can either select to display/NOT display your badge for customers from selected countries

The app will base on the IP address of customers to display/NOT display the badge.

👉 Example,

When you select "Include" + Choose 3 countries: Belgium, Bermuda & Brazil

⇒ Then only customers coming from these 3 countries can see the badge.

4. Choose the target customer condition

Choose which types of customers can see the badge:

5. Select the time display

  • By choosing the start date & end date, you can schedule when the badge will appear on your website.

6. Set up the badge's priority

  • This will control the order in which badge is displayed on products, especially when multiple badges are applied to the same item.

  • This prevents badges from overlapping and ensures the most important badges are always visible.

Last updated