How to Add Progress Bar in Blogger

Last updated:

Adding a progress bar on blogger post or page is a great way to visually represent progress, skills, or milestones in your content. This step-by-step guide will help you easily insert customizable progress bars into your blogger posts or pages using shortcodes.

Colorful Progress Bars in Blogger

Steps to Add Progress Bars in Blogger

  1. Log in to your Blogger dashboard
  2. Navigate to the Posts or Pages section.
  3. Open the page editor for the content where you want to add progress bars.
  4. Make sure you are in Compose view mode for an easier content creation.
  5. Insert the following shortcode within your page or post content:
    [getProgress text="English" progress="85%" color="#ffffff" bgColor="#2196f3"]
  6. Customize the shortcode by modifying:
    • text: Change the label of the progress bar (e.g., "Marketing," "Python").
    • progress: Set the percentage of progress (e.g., "50%", "75%").
    • color: Choose the text color for the progress bar.
    • bgColor: Set the background color of the progress bar.
  7. Highlight the shortcode and apply the Bold style.
  8. Publish or update your post/page.

In this way, you can enhance your content with visually appealing progress bars, improving user engagement and readability.

😊 Still need help? Contact us here