# Product Labels This is a feature that allows you to add a label to products according. You can label your products as bestseller, limited stock, new arrival, discounted rate etc.
To create these labels, follow these easy-peasy steps: ### **1. General**
* **Label Identification Name** – Assign an internal name to help you distinguish this label from others in your dashboard. * **Status** - Select the status of the label: Active/Inactive * **Label Type** – Select how you want the label to appear on the storefront: #### 1. **Image** Allows you to display a custom image as a label or badge. **Example:** A **“New Arrival”**, **“Hot Deal”**, or **Sale** badge image uploaded by you.
#### **2. Text** Displays a custom text message as a label.\ **Example: "Best Seller", "Limited Offer",** or **"Trending"**
#### **3. Timer** This field allows you to set the text that appears along with the countdown timer. * Use the variable**{%-timer-%}** to display the live countdown. * You can place this variable anywhere in your text. **Example:**\ Starts in {%-timer-%}\ 👉 This will show text like: *Starts in 02:15:30* #### **Date & Time** Set the end date and time for the countdown timer. **Format:**\ dd-mm-yyyy --:-- * **dd** → Day * **mm** → Month * **yyyy** → Year * **--:--** → Time in hours and minutes (24-hour format) **Example:**\ 25-03-2026 18:30\ 👉 The timer will count down until 25 March 2026 at 6:30 PM. #### **Choose Image** Select a background image for the timer section. * The chosen image will appear behind the timer text. * This helps make the timer more visually attractive and noticeable. * For best results, use a clear image with enough contrast so the timer text remains readable.
#### **4. Discount** Choose **Discount** when you want to highlight a price reduction on the product, such as a percentage off or a fixed amount off.\ This label helps customers quickly notice savings, which can increase click-through and conversions. #### **Discount Variable** This field defines **what value will be shown in the discount label**. Available variables: * **{%-percentage-%}** → Displays the discount in percentage\ \&#xNAN;*Example: 20% OFF* * **{%-money-%}** → Displays the discount as a fixed amount\ \&#xNAN;*Example: $10 OFF* 👉 The value is calculated automatically based on the product’s original price and sale price. #### **Select Price Variable** Use this option to choose **how the discount should be calculated and displayed**: * Select the **percentage** when you want to show savings in %. * Select **money** when you want to show the exact amount saved. This gives you flexibility to match your store’s pricing strategy and customer preference. #### **Discount Text** This field controls **the text shown on the discount label**. You can use these variables: * **{%-percentage-%}** * **{%-money-%}** **Example texts:** * **Discount {%-percentage-%}** → Displays: *Discount 20%* * **Save {%-money-%}** → Displays: *Save $15* 👉 The variable will be replaced dynamically with the correct discount value for each product.
#### **5. Price** Select **Price** when you want to display product pricing directly on the label instead of a discount.\ This is useful for products with **price ranges** or variable pricing. #### **Price Variable** Choose which price value to display: * **{%-min\_price-%}** → Shows the lowest product price * **{%-max\_price-%}** → Shows the highest product price The value updates automatically based on product variants. #### **Select Price Variable** Use this option to control whether the label shows the **minimum** or **maximum** product price. #### **Price Text** Customize the label text using price variables. **Examples:** * Min Price {%-min\_price-%} → Displays: *Min price $49* * Up to {%-max\_price-%} → Displays: *Up to $199* #### **When to Use This Label** * Products with multiple variants and different prices * Collections where you want to show the **starting price** * Custom or configurable products **Example:**\ A T-shirt available in multiple sizes:\ \&#xNAN;*The minimum price of $19* helps customers understand the starting cost at a glance
#### **6. Inventory Quantity** Select **Inventory Quantity** to display the available stock count on the product label.\ This helps create urgency and informs customers about limited availability. #### **Inventory Text** Customize the label text using the inventory variable. * **{%-Inventory\_qty-%}** → Displays the current available stock quantity **Example:**\ \&#xNAN;**{%-Inventory\_qty-%}** items left → Displays: *5 items left* The value updates automatically based on real-time inventory. #### **When to Use This Label** * Low-stock or fast-selling products * Flash sales and limited-time offers * To create urgency and encourage quicker purchases
#### **7. Inventory** Select **Inventory** to show a **stock status message** instead of an exact quantity.\ This is useful when you want to inform availability without revealing numbers. #### **Inventory Text** Customize the label using the inventory status variable. * **{%-Inventory-%}**→ Displays the product’s inventory status automatically\ (e.g., *In stock*, *Sold Out*) **Example:**\ \&#xNAN;**{%-Inventory-%}** → Displays: *In stock*
#### **When to Use This Label** * When you prefer **status-based messaging** over exact quantities * For high-volume products where numbers change frequently * To keep inventory details simple and clean ### **2. Configuration**
**Product Label Appearance** – Customize how your product label will look by configuring the following options: * **Label Position** – Choose where to display the label: Top Left, Top Right, Bottom Left, or Bottom Right * **Label Shape** – Select the desired shape or style for your label * **Width & Height** – Define the overall size of the label * **Border Radius** – Adjust the corner roundness for sharp or rounded edges * **Rotation** – Tilt or angle the label as needed **Set Style of the Label :** * **Margin (Top/Bottom & Left/Right)** – Set spacing outside the label * **Padding (Top/Bottom & Left/Right)** – Set spacing inside the label * **Text Style** – Customize the label text (e.g., font size, weight, decoration, etc.) **Color & Size** – Configure the background color, title/text color, and text size of your product label.
**Tooltip & Link** – Set a tooltip or hover text for your label, and optionally add a link to related products that can open in a new tab.
**Animation** – Enable animation for your label and choose the desired animation type.
3. **Conditions** Select where you want to show your product labels on; * Home page * Product pages * Collection/category pages
You can precisely control **when and where your labels appear** across your store. Configure them using the following conditions: **1. All Products** Select this option if you want your labels to be displayed on **every product** available in your store.\ This is useful for global announcements like **store-wide sales**, **seasonal offers**, or **new collection highlights**.
**2. Specific Products** Use this option to show labels only on **selected individual products**.\ You can manually pick products where you want the label to appear, ideal for **best-sellers**, **limited-edition items**, or **featured products**.
**3. Specific Collections** This allows you to apply labels to **entire collections** instead of selecting items one by one.\ Perfect for **category-based promotions**, such as discounts on “Winter Wear,” “Electronics,” or “New Arrivals.”
**4. Product Tag** Display labels based on product tags. For example, products with tags that **include or exclude keywords like “Sale,” “New,” or “Limited Stock”** can automatically have the corresponding labels applied. This is great for automated and dynamic label placement.
**5. Product Title** Configure labels based on **product titles** using conditions like : * **Contains** – Apply label if the title includes specific keywords. * **Doesn’t Contain** – Apply label if the title excludes certain keywords. * **Is Equal To** – Apply label if the title exactly matches a keyword. * **Is Not Equal To** – Apply label if the title does not exactly match a keyword. * **Starts With** – Apply label if the title begins with a keyword. * **Ends With** – Apply label if the title ends with a keyword. \ For instance, all products with “**Premium**,” “**Organic,**” or “**Combo**” in their title can have special labels applied automatically.
**6. Product Vendor** Apply labels to products from vendors whose names **contain, don’t contain, are equal to, are not equal to, start with, or end with** specific keywords. This is useful for highlighting **brand-based promotions** or showcasing products from particular suppliers.
**7. Product Price** Set rules based on product price using conditions like **equal to, greater than, less than, in range, or not in range**. For example, you can show labels on products above or below a certain price perfect for highlighting **budget-friendly** or **premium-range items**.
**8. Product Inventory** Display labels based on your product’s stock status or quantity.\ You can set conditions such as: * **In Stock** – Show labels when inventory is available. * **Out of Stock** – Show labels when inventory is zero. * **Greater Than (>)** – Apply labels when stock is above a set number. * **Less Than (<)** – Highlight low stock. This helps automate stock-based labels like “**Low Stock**,” “**Few Left**,” or “**Out of Stock**.”
**9. Product Published** Show labels based on a product’s publish date using conditions like **older than, newer than, in between a certain period, or not in between a certain period**. * This is ideal to highlight **new arrivals** or recently launched products with labels like **“New Arrival”** or **“Just Launched”**. * Promote products that have been in your store for a longer time, for example, with labels like **“Best Seller”** or **“Popular Item”**. * You can **automate labeling based on a product’s lifecycle** without manual updates. For example, you can apply labels like **“Not Available”** to products published **outside a specific time period** or within a certain duration, ensuring labels are always relevant and up-to-date.
## Product Badges This feature allows you to add badges to your products, such as, in discount, sale, coming soon, and many more such badges. **Step #1** Select the **Add New Badges** button.
**Step #2** To create these badges, follow these easy-peasy steps : 1. **General** : * **Badge Identification Name** – Assign an internal name to help you distinguish this badge from others in your dashboard. **- Badge Type** – Select how you want the badge to appear on the storefront: **- Image Badge** – Upload an icon or image as your badge. **- Text Badge** – Display a custom text-based badge. * Frontend Display Name – Enter the actual badge name that will be shown to customers on the storefront.
2. **Configuration** **Badge Appearance** – Customize how your badge will look by configuring the following options: * **Badge Position** – Choose where to display the badge: **Top Left, Top Right, Bottom Left, or Bottom Right** * **Badge Shape** – Select the desired shape or style for your badge * **Width & Height** – Define the overall size of the badge * **Border Radius** – Adjust the corner roundness for sharp or rounded edges * **Rotation** – Tilt or angle the badge as needed
**Badge Style Settings**: * **Margin (Top/Bottom & Left/Right)** – Set spacing outside the badge * **Padding (Top/Bottom & Left/Right)** – Set spacing inside the badge * **Text Style** – Customize the badge text (e.g., font size, weight, decoration, etc.) * **Color & Size** – Configure the background color, title/text color, and text size of your badge * **Badge Adjustment** – Fine-tune the position, alignment, and spacing of the badge for perfect placement on your products
**Color & Size** : Configure the **background color**, **title/text color,** and **text size** of your badge.
**Tooltip & Link** – Set a tooltip or hover text for your badge, and optionally add a link to related products that can open in a new tab.
**Animation** – Enable animation for your badge and choose the desired animation type.
3. **Conditions :** Select where you want to show your product badges on; * Home page * Product pages * Collection/category pages
You can precisely control **when and where your badges appear** across your store. Configure them using the following conditions: **1. All Products** Select this option if you want your badges to be displayed on **every product** available in your store. This is useful for global announcements like **store-wide sales**, **seasonal offers**, or **new collection highlights**.
**2. Specific Products** Use this option to show badges only on **selected individual products**. You can manually pick products where you want the badge to appear, **ideal for best-sellers**, **limited-edition items**, or **featured products**.
**3. Specific Collections** This allows you to apply badges to entire collections instead of **selecting items one by one**. Perfect for category-based promotions, such as discounts on “**Winter Wear**,” “**Electronics**,” or “**New Arrivals.**”
**4. Product Tag** Display badges based on product tags. For example, products with tags that **include or exclude keywords like “Sale,” “New,” or “Limited Stock”** can automatically have the corresponding badges applied. This is great for automated and dynamic badge placement.
**5. Product Title** Configure badges based on **product titles** using conditions like : * **Contains** – Apply badge if the title includes specific keywords. * **Doesn’t Contain** – Apply badge if the title excludes certain keywords. * **Is Equal To** – Apply badge if the title exactly matches a keyword. * **Is Not Equal To** – Apply badge if the title does not exactly match a keyword. * **Starts With** – Apply badge if the title begins with a keyword. * **Ends With** – Apply badge if the title ends with a keyword. \ For instance, all products with “**Premium**,” “**Organic,**” or “**Combo**” in their title can have special badges applied automatically.
**6. Product Vendor** Apply badges to products from vendors whose names **contain, don’t contain, are equal to, are not equal to, start with, or end with** specific keywords. This is useful for highlighting **brand-based promotions** or showcasing products from particular suppliers.
**7. Product Price** Set rules based on product price using conditions like **equal to, greater than, less than, in range, or not in range**. For example, you can show badges on products above or below a certain price perfect for highlighting **budget-friendly** or **premium-range items**.
**8. Product Inventory** Display badges based on your product’s stock status or quantity.\ You can set conditions such as: * **In Stock** – Show badges when inventory is available. * **Out of Stock** – Show badges when inventory is zero. * **Greater Than (>)** – Apply badges when stock is above a set number. * **Less Than (<)** – Highlight low stock. This helps automate stock-based badges like “**Low Stock**,” “**Few Left**,” or “**Out of Stock**.”
**9. Product Published** Show badges based on a product’s publish date using conditions like **older than, newer than, in between a certain period, or not in between a certain period**. * This is ideal to highlight **new arrivals** or recently launched products with badges like **“New Arrival”** or **“Just Launched”**. * Promote products that have been in your store for a longer time, for example, with badges like **“Best Seller”** or **“Popular Item”**. * You can **automate labeling based on a product’s lifecycle** without manual updates. For example, you can apply badges like **“Not Available”** to products published **outside a specific time period** or within a certain duration, ensuring badges are always relevant and up-to-date.
--- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://magecomp.gitbook.io/shopify/apps/star-product-labels-and-badges/product-labels.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.