Create a Badge
Create an image badge
Steps to manage
1. From the app admin page, click Badges and Labels
2. Click Create new badge/label button > Select Badge type > Create
3. In the Badge configuration, select settings to design your own badge
- Click Active/Draft button to decide the status of the badge
- Badge name: Enter the badge name in the Name field. For example: Pre-order.
Only admin can view this name.
- Badge Selection: There are 2 types of badge selection: Image and Text > click the Select Image button
– Select badge image:
Select a suggestion image below or add your own image
You can change or delete the selected image:
Add link and tooltip for the badge here:
– Visibility date: Select the data range the badge is shown on your front store. Leave the date field blank if you don’t need it.
- Design
Customize your badge based on your needs by all the setting option here: Position of the badge non the product page, Size, Margin, Animation,…
– Position
Change the position of the badge on the product page by selecting one of the option:
Click Custom and customize the position of the badge based on your needs.
– Size: select one of the options small, medium, large or customize it by yourself
– Animation: Change the effect to show the label shows up on your front store
– Margin top and Margin top: change the space above and under the badge
- Size on Tablets: change the size of label on the tablets
- Size on Mobiles: change the size of label on the mobile view
If you don’t want to change the size on tablets or mobiles, just leave the fields blank
4. Select products to show the label
Please view this guide for more detail
5. Click Save to update the changes
6. Go to the front store and check the result
Create a text badge
1. From the app admin page, click Badges and Labels
2. Click Create new badge/label button > Select Badge type > Create
3. In the Badge configuration, select settings to design your own badge
- Click Active/Draft button to decide the status of the badge
- Badge name: Enter the badge name in the Name field. For example: Hot sale.
Only admin can view this name
- Badge Selection
– Type: There are 2 types of badge selection: Image and Text > select Text
– Content: Use variant and text entered here to create your badge
For example: Hot sale {product_type}
– Link: Enter the link of the badge image
– Tooltip: Enter the tooltip of the badge (text shows up when customers hover the badge image
- Visibility date: Select the data range the badge is shown on your front store. Leave the date field blank if you don’t need it.
- Design
Customize your badge based on your needs by all the setting option here: Position of the badge, Size, Margin, Animation,…
– Shape: select one of the options in the shape dropdown
– Position:
Change the position of the badge on the product page by selecting the option
- Below the product image
- Below the product title
- Below the product price
- Custom
Click Custom and customize the position of the badge based on your needs.
– Size: select one of the options small, medium, large or customize it by yourself
– Animation: change the effect to show the badge shows up on your front store
- Text
Design the text of the badge
– Font Style
Click the Change button to select the font you want to use
Then design the font by setting below:
Or tick the checkbox Use Custom Font Style to customize your own font:
- Border: change the size and style and of the border
- Color: change the color of the text, border, and background of the badge
- Size on Tablets: change the size of label on the tablets
- Size on Mobiles: change the size of label on the mobile view
If you don’t want to change the size on tablets or mobiles, just leave the fields blank
4. Select products to show the badge
Please view this guide for more detail
5. Click Save to update the changes
6. Go to the front store and check the result
If you do encounter any difficulty while proceeding these steps, don’t show any hesitation to contact us promptly via the email address support@samita.io
We are always willing to help with all sincerity!