Guide for Setting Up Counter Percentage Bar Blocks

Slide Note
Embed
Share

"Learn how to create and customize Counter Percentage Bar blocks on your website step-by-step. Discover how to add titles, set background themes, select visibility options, and customize colors for your titles effortlessly."


Uploaded on Oct 11, 2024 | 0 Views


Download Presentation

Please find below an Image/Link to download the presentation.

The content on the website is provided AS IS for your information and personal use only. It may not be sold, licensed, or shared on other websites without obtaining consent from the author. Download presentation by click this link. If you encounter any issues during the download, it is possible that the publisher has removed the file from their server.

E N D

Presentation Transcript


  1. Guide for Counter percentage bar Block

  2. First click the small plus symbol. Then click Counter percentage bar to begin creating.

  3. At the top you can write a Title. This will not be shown on HTML page, but will give your block a Title in the admin.

  4. Beneath Title you can set Background theme.

  5. To go live, first click the arrow to open the menu. Then click Publish.

  6. Click View live to open your webpage and see what you created.

  7. Going live we can see our Dark background theme at the top. And our Light background theme We will get to the contents on the banner later.

  8. Below Background theme, you can select when or for whom the block will be shown. Always: Will always show. Logged out: Only shows when viewer is logged out. Logged in: Only shows when viewer is logged in. Is customer: Only shows when viewer is a customer. Is staff: Only shows if viewer is a staff. Is admin: Only shows when viewer is an admin.

  9. Beneath Show block you can write a Title.

  10. Going live we can see our Title.

  11. Beneath Title you can Choose color for your title. Let s make it Light Grey.

  12. Going live we can see our Title is now Light Grey in color.

  13. Beneath Choose color for your title you can set Percentage.

  14. Going live we can see our 75% showing up in number, and the yellow bar beneath the title is now 75% of the width.

  15. Beneath Percentage you can Choose color for percentage count. Let s make it White.

  16. Going live we can see our Percentage is now shown in White.

  17. Beneath Choose color for percentage count you can Choose color for percentage bar. Let s make it Blue (logo).

  18. Going live we can see our Percentage bar is now shown in a blue color.

  19. You can add another item by clicking the plus icon.

  20. Fill out the fields like before.

  21. Going live we can see our new item.

Related