Product Badge
The Product Badge is a small widget that appears on your product pages, letting customers know that their purchase contributes to environmental impact.
What it displays
The Product Badge shows a concise message such as "We plant trees, clean the ocean & capture carbon for every order." This text is automatically generated based on the impact categories you have enabled in the app.
When a customer clicks the info icon on the badge, a popup opens with:
- Impact details — A breakdown of each impact category and quantities
- Carousel images — Photos from reforestation sites, ocean cleanup operations, and carbon capture projects
- Certificate information — An explanation of how impact is tracked and certified
Badge styles
The Product Badge comes in two visual styles:
Pill
A rounded, self-contained badge with a background color. Works well as a standalone element below the product title or above the Add to Cart button.
Inline
A flat text-based badge without a background container. Blends into the surrounding text and works well within product descriptions or alongside other product metadata.
Installation
- Go to your Shopify admin
- Navigate to Online Store → Themes → Customize
- Open a product page template
- Click Add block or Add section and search for 1ClickImpact Product Badge
- Position the block where you want it to appear
- Click Save
The Product Badge is a theme block, not an app embed. You place it manually on your product page template so you have full control over its position.
Customization options
The following settings are available in the theme editor when you select the Product Badge block:
- Style — Choose between Pill and Inline
- Font size — Adjust the text size to match your theme typography
- Accent color — Controls the info icon and popup highlight color
- Text color — Sets the badge text color
- Background color — Sets the badge background (Pill style only)
- Popup background — Changes the background color of the detail popup
- Popup text color — Changes the text color inside the popup
Popup details
The popup that opens when a customer clicks the info icon is designed to build trust. It includes:
- A summary of the impact this store makes
- A scrollable carousel of real project photos
- Information about tracking and certificates that verify each contribution
- Links to learn more about the impact partners
The popup is mobile-friendly and appears as a bottom sheet on smaller screens.
The badge text updates automatically when you enable or disable impact categories in the app. You do not need to manually edit the message.