Product Badges

Customize these badges to fit your store's design and effectively draw attention to important product details. You can find these settings under Appearance -> Customize -> WooCommerce -> General Settings -> Product Badge, the options are explained below.

Badge Style

Customize the appearance of your product badges by selecting from the following styles:

Normal

A standard badge shape.

• Upper Case: Toggle this option to automatically convert badge text to uppercase.

• Outline: Toggle to switch between an outlined version or a filled badge.

Default Badge

Outlined Badge

Circle

A circular badge style.

• Upper Case: Toggle this option to automatically convert badge text to uppercase.

• Size: Adjust the size range of the badge.

• Radius: Set the border radius for a more rounded badge.

• Fixed Size: Toggle to maintain a fixed size, preventing the badge from resizing with text. This is particularly useful for badges with longer texts, such as "Out of stock."

Triangle

A triangular badge that can be used on the edges of the image.

• Upper Case: Toggle this option to automatically convert badge text to uppercase.

• Size: Adjust the size range for the badge.

Sale Badge

Options related only to the sale badge

Show as Percentage: Toggle this option to display the sale discount as a percentage instead of the default "SALE!" text. This provides a clear view of the discount offered.

Here is an example of how they look:

Sale Badge With Percentage

Default WooCommerce Sale Badge

Enabled Badges

Select which badges you want to display on your products:

• Sale

• Featured

• Out of Stock

• Backorder

Style

Customize the colors for each badge type:

• Sale: Choose the text color and background color for sale badges.

• Featured: Select the text color and background color for featured product badges.

• Out of Stock: Adjust the text color and background color for out-of-stock badges.