Articles on: Content Management

Adding Badges

Articles on: Content Management


In this help article we will show how to add and customize badges.


Adding Badges




To add a badge, in the


Content Tab


map a column or several columns from your Google Sheet to the Badges element:



You can map several columns as well, each value will be of its own color.

Multiple values from the same column separated by commas will be displayed as badges of the same color.



Changing the badges colors




You can customize the color of badges by adding the following custom CSS code:

  • Copy the following code:


undefined .sv-badge__1 { background-color: #d21ac4; } .sv-badge__2 { background-color: #00bf7a; } .sv-badge__3 { background-color: #ffc01e; } .sv-badge__4 { background-color: #ff4d4d; }



  • Change the values after background-color: -- add the colors you want to have on your website in HEX format

  • Add the modified code lines to the Settings -> Inject custom code -> section text area.

  • Save the changes.


Updated on: 06/03/2023

Updated on: 28/12/2023

Was this article helpful?

Share your feedback

Cancel

Thank you!