Many WordPress users may have thought about how nice it would be to have a progress bar for different posts within WordPress. Maybe you want to use it for fundraising to market milestones or maybe you want to use it for a different reason. Here’s how you can add a progress bar to your WordPress posts, widgets and pages.
Using the Progress Bar Plugin
When you install the Progress Bar Plugin, it will work right out of the box. You don’t have to change any settings at all. Just install and activate it like you would any other plugin.
After you have installed and activated the plugin, you will be able to use it with a very simple shortcode. The shortcode just gets inserted wherever you want to put the progress bar. If you want to put it in a widget, put the shortcode in a text widget. If you want it in a post or page, just used it within the text editor of the post or page you want the bar to show up within.
The shortcode you will use is: [wppb progress=65]. You can change the number to anything you want between 0 and 100. The picture below shows the bar with the shortcode above, which represents 65% full.
Customizing the Progress Bar
You don’t just have to put a progress bar that’s blank on your website. Instead, you can change the color, add text and customize it in many different ways.
If you want to adjust the appearance, you can add to the short code with the “option=” code. Here are a few examples.
[wppb progress=65 option=red]
[wppb progress=65 option=candystripe]
[wppb progress=65 option=”animated-candystripe orange”]
There are several options and you can combine any color with the candystripe or with the animated-candystripe options.
You can also add text to the progress bar with this code:
[wppb progress=65 text=”Add Text Here”]
Another option, with this plugin, is adding currency to it. This is great if you are trying to raise money for a charity. Here’s the code for currency.
[wppb progress=”$650/1000″ text=”$650/$1000 Raised”]
Now you can add a progress bar for any reason and you can add text, change the color or even allow it to show currency.
