The Badge addon is a versatile addon available for your EasyStore Storefront page. It allows you to highlight products with customizable badges, such as "On Sale" or "Featured." You can adjust the badge typography, style, and appearance to align with your store's branding. This addon is essential for eCommerce shops as it draws attention to special products, effectively promotes offers, and enhances your product listings' visual appeal.

Sale

Text: The first option you get after enabling this setting is the ability to change the text. From the dropdown menu, choose between “Sale”, “On Sale”, “%s Off”, and “Custom”. If you select “Custom”, an additional text field will appear where you can insert your desired text.

Typography: You can customize the font type, font size, Line Height, Letter Space, Style, and Weight of the badge. You can choose the screen type, and set different font settings for each screen type (Laptop, Tablet Landscape, Tablet Portrait, Mobile Landscape, and Mobile Portrait). SP Page Builder automatically adjusts typography for responsive design by default. 

Color: You can adjust the color of the badge using this option. You can control whether there will be a hover animation or not.

Background: You can adjust the background color of the badge using this option.

Featured

Text: Use the text field to give a proper title that describes the feature badge.

Typography: You can customize the font type, font size, Line Height, Letter Space, Style, and Weight of the badge. You can choose the screen type, and set different font settings for each screen type (Laptop, Tablet Landscape, Tablet Portrait, Mobile Landscape, and Mobile Portrait). SP Page Builder automatically adjusts typography for responsive design by default. 

Color: You can adjust the color of the badge using this option. You can control whether there will be a hover animation or not.

Background: You can adjust the background color of the badge using this option.

Basic

Padding: You can adjust the padding dimensions for the badge. You can choose the screen type, and set different padding dimensions for each screen type (Laptop, Tablet Landscape, Tablet Portrait, Mobile Landscape, and Mobile Portrait). SP Page Builder automatically adjusts padding for responsive design by default. 

Border: Similar to the radius, you can adjust the border radius of the button via a slider or input field. You have the option to adjust the border type (solid, double, dotted, dashed, groove, ridge, inset, outset) as well as the opacity of the border.

Border Radius: Using the slider and adjacent field you can adjust the border radius in pixels.