⌘K

Badges & Labels

Draw attention to special options with visual indicators like "Popular", "Sale", or "New".

Overview

Badges and labels help customers make decisions by highlighting noteworthy options. They can indicate popularity, sales, new arrivals, or any custom message you want to convey.

Built-in Badge Types

Indicates the most chosen option:

  • Builds social proof
  • Helps indecisive customers
  • Can increase conversions

Sale

Shows options with special pricing:

  • Draws attention to deals
  • Creates urgency
  • Highlights value

New

Marks recently added options:

  • Showcases fresh offerings
  • Encourages exploration
  • Great for seasonal items

Your suggestion or best value:

  • Guides customer choice
  • Highlights quality options
  • Can be based on value or quality

Limited

Creates scarcity perception:

  • Encourages quick decisions
  • Suitable for exclusive items
  • Use honestly for best results

Adding Badges to Options

Adding a Single Badge

  1. Open the add-on group
  2. Edit the option you want to badge
  3. Find the Badge field
  4. Select a badge type from the dropdown
  5. Save the option

Custom Badge Text

  1. Select "Custom" as badge type
  2. Enter your custom text (e.g., "Best Value")
  3. Choose a color scheme
  4. Save
💡 Tip: Keep custom badge text short—1-2 words work best.

Styling Badges

Color Schemes

Badge Type Default Color Suggested Use
Popular Blue Social proof
Sale Red Discounts, deals
New Green Fresh items
Recommended Purple Suggestions
Limited Orange Scarcity

Custom Badge Colors

Override default colors:

  1. Select the badge type
  2. Click "Customize Colors"
  3. Set background color
  4. Set text color
  5. Preview and save

Badge Position

Control where badges appear:

  • Top Right - Corner overlay (default)
  • Top Left - Alternative corner
  • Below Label - Under the option name
  • Inline - Next to the option text

Display Options

Badges on Swatches

For swatch display types:

  • Badge appears as small overlay
  • Position in corner of swatch
  • May use icon instead of text
  • Full text on hover

Badges on Lists

For radio/checkbox/dropdown types:

  • Badge appears inline with option text
  • Small pill/tag format
  • Full text always visible

Strategic Use of Badges

Leveraging Social Proof

Use "Popular" badges effectively:

  • Mark genuinely popular options
  • Can show selection percentage ("80% choose this")
  • Updates customer perception
  • Helps reduce decision paralysis

Creating Urgency

Use "Limited" and "Sale" badges:

  • Be truthful about limitations
  • Combine with actual limited inventory
  • Time-limited sales with end dates
  • Avoid overuse to maintain credibility
⚠️ Important: Only use scarcity badges when the scarcity is real. False urgency damages trust.

Guiding Decisions

Use "Recommended" badges to:

  • Highlight best value options
  • Suggest quality choices
  • Guide uncertain customers
  • Increase AOV with premium options

Automated Badge Rules

Automatically badge top sellers:

  1. Go to Uplift Settings
  2. Find "Auto Badges" section
  3. Enable "Auto-mark popular"
  4. Set threshold (e.g., top 20% by sales)

Auto-Sale Badge

Badge options linked to sale-priced products:

  • Detects compare-at price in Shopify
  • Automatically applies Sale badge
  • Removes when sale ends

Auto-New Badge

Badge recently created options:

  • Set time window (e.g., 30 days)
  • Automatically applies/removes
  • No manual maintenance needed

Best Practices

  • Use sparingly - Too many badges dilute their impact
  • Be honest - Only use truthful claims
  • Stay consistent - Use same badge types across your store
  • Update regularly - Remove outdated badges
  • Test impact - A/B test badge strategies
  • Match your brand - Customize colors to fit your design

Troubleshooting

Badge not showing

  • Verify badge is saved on the option
  • Check badge display is enabled in settings
  • Clear cache and refresh storefront

Badge styling looks wrong

  • Check for CSS conflicts in theme
  • Review custom color settings
  • Test with default colors first

Next Steps