General badge options

  • Enable shop manager: the shop manager will be able to edit badge management settings. By enabling this option, the shop manager will be able to:
    • manage badges
    • see the badge settings (YITH Plugins -> Badge Management) [all settings]

shop manager

When using the badge plugin on your mobile device, the image size might be off. By using the “Mobile breakpoint” option, you can edit this size so the badge will be shown correctly.

mobile breakpoint

With the Force positioning option, you can force the badge positioning through JS to prevent theme issues that may occur. You can choose one of the options given in the drop down menu:

  • No
  • Single product
  • Single product image
  • Shop page
  • Everywhere

Configure badge

To create a new badge to apply to the products of your shop, click on the “Add badge” field that you find in the “Badges” section.

add new badge

The badge can be of “text”,”CSS”,”image” and “advanced” type. We singularly analyze each type.

badge typologies

Text badge

The badge is entirely formed of a text label, for which you can customize colors, size, width, height and position.

text badge options

text badge

Image badge

Image badges give you the opportunity to choose among a series of ready badges or to upload a customised one using the button “Upload”.
In the section “Opacity and Position”, you can set the badge opacity and its position on the product image.

image badge options

image badge

Advanced badge

advanced badge options

Advanced badges have a pre-set style for which you can change text color and background color. The peculiarity of this type of badges is that they can be used only for “On sale” products and the discount percentage displayed is automatically derived from values in regular price and sale price for each product.
In addition to the discount percentage, some badges also show the actual sum (currency value) discounted from the product and allow users to learn how much they are saving on that product purchase.
Let’s make an example. We’ll set a “regular price” of 10£ and for “sale price” of 3£ to one of our products . The discount percentage will be 70% and the discounted sum 7£. This is what the badge might look like:

advanced badge

Variable products

By default, the “advanced badge” will only be shown if all the configured variations have the same discount percentage.
However, this behavior can change based on its settings in “Show advanced badges in variable products”.

advanced badges

As an alternative, you can decide to show the minimum or maximum discount percentage among all the available variations.
Please note: The badge will not be displayed if you have decided to show the minimum discount percentage and you haven’t set any discount on one of the variations.

Opacity and position

Rotation

With the rotation option, you can rotate the image like a 3D object. You can rotate using the three principle axes X, Y and Z.

rotation badge

You can either choose to use ´number´ or ´slider´ mode as you can see in the image below.

rotation badge slider

Flip Text

You can flip the text up-side-down, as a mirror image, or both. By using the´flip text´ tool, you can check the boxes you want.

text horizontally

Text vertically

WPML

This plugin is 100% compatible with WPML.
This means you will be able to get different badges on the same product, according to the language the users are using.
In order to create a different copy of the badge for one of the languages configured using WPML, access the badge edit page, select the language and click on the “create” button.

translate badge

If this operation worked as intended, you will be automatically redirected to the edit badge page for the language you selected.
From here, you will be able to configure the badge starting from scratch as you usually would.
The next step will involve applying the badge to the translated copy of the product.

 

How to apply a badge

The plugin allows assigning the badge to single products or in bulk mode and to assign the same badge to all products of a specific category.
Furthermore, you can also select one or more badges that will be automatically assigned to the newest products, the ones on sale and/or set as “featured”.
You can simultaneously apply different badges on the same product.

Single product

To assign a badge to a specific product of the shop, go to its editing page and select one of the badges you created, in “Product Badge” field.

single product association

Also, you can schedule when the badge appears and specify the start and end date to show it.

schedule badge

In case you want to hide the badge in product detail page, enable “Hide on Single Product” field that you find in the plugin settings dashboard.

How to edit badges

If you need to add or remove badges from a product, you can easily do it through the quick edit option of the related product.