Promote key products with the Product Badges module of WooCommerce. For example, add text badges, such as new arrivals, bestsellers, or special discounts, to attract customers.
This enhances engagement and draws potential customers’ attention. You can highlight special products with eye-catching images and text badges.
Product Badges #
The Product Badges module has 3 different tabs. General, Settings, and Create Badges.
1. General #
Click on the general section.
1.1 Enable Product Badges: Enabling Product Badges is a mandatory option to enable all other settings.
1.2 Hide Theme Badges: This control will hide default badges ( Example: Flash sale ).
1.3Applicable Products: If you switch on the “Hide Theme Badges” control, the applicable products control will appear. You need to choose one of two options: hide badges for all products or only those with custom badges enabled.
Now, click on the “Save Changes” button to save all the updates.
2. Settings #
Click on the Settings tab. Note: These settings will not apply to Elementor widgets, as Elementor has its own controls. This setting is for the default layout configuration only. Elementor has its own controls for badges.
2.1 Group Badge Display Type: Choose between horizontal and vertical layouts. Select any one option from here. Badges will be displayed in this layout for product showcases such as shop and archive pages, related products, upsells, and cross-sells.
2.2 Group Badge Gap/Spacing: Adjust the space between badges by selecting your preferred gap or spacing.
2.3 Shop Page Group Position: Multiple badges will be grouped and displayed based on the selected position on the shop page. If you select “Custom Position”, then you need to fill out “Hook Name” and “Badge Position Priority” for the shop page.
2.4 Position Above Image: Users can choose this option if the Shop Page Group Position is set to “Floating Above Image.”
2.5 Product Page Group Position: You can choose the group badge’s position on the product page. If you select “Custom Position”, then you need to customize “Hook Name” and “Badge Position Priority” for the shop page.
2.6 Position Above Image: Users can choose this option if the Product Page Group Position is set to “Floating Above Image.”
Now, click on the “Save Changes” button to save all the updates.
3. Create Badges #
Click on the Create Badges tab.
3.1 To add new product badges, click on the “Add New” button below.
3.2 Badge Name: The badge name serves as an identifier, helping users easily understand the purpose of each badge.
3.3 Badge Type: Users can choose either one from two different badges: Dynamic and Custom.
3.4 Dynamic Badge Condition: Users can specify a dynamic badge condition. Dynamic badges include Products On Sale, Featured Products, Out Of Stock Products, Best Selling Products, Pre-order Products, and New Arrival Products.
3.5 Show Badge As: Badges can be displayed as either an image or text.
3.6 Text Badge Preset: This field will appear if badges are set to be displayed as Text.
3.7 Enter Badge Text: The badge text will be displayed when the dynamic percentage switch is turned off.
3.8 Show Badges Percentage: Users can enable this option to show badges as a dynamic percentage instead of text.
3.9 Applicable For: Badges will apply to selected products or categories.
3.10 Applicable Products: If “Applicable For Product” is selected, the badge will apply only to the specified products.
3.11 Exclude Products: Users can exclude badges for selected products.
3.12 Text Color: Choose the product badge text color from the color palette.
3.13 Background Color: Select the background color of the badge.
Front End View of Product Badges #
You can see the product badges in the product listings page.
Multiple Product Badges are displaying on Product Page.
