Progress bar plugin for wordpress, responsive progress bar and retina ready, full customize, compatible with major browsers, easy to use, one wordpress shortcode only.

WP Progress Bar Plugin Features

  1. Fully Responsive.
  2. Retina Ready.
  3. Full Customize.
  4. Settings Page (you can set default options easily).
  5. Compatible with all major browsers.
  6. One shortcode & Easy to use.

Live Demo (default style)

CSS3 25%
HTML5 50%
JavaScript 75%

Live Demo (custom style)

CSS3 25%
HTML5 50%
JavaScript 75%
CSS3 25%
HTML5 50%
JavaScript 75%

More demos? Visit my resume page, and take a look at the “My Skills” chapter.

Progress Bar Plugin

Download plugin and install it and activate it, if you want to set default options, go to Plugins menu > WP Progress Bar.

Progress Bar Shortcode

Just use this shortcode:
[wp_progress_bar text=”Photoshop” pc=”90″]
Now your “Photoshop” skill will be “90%”.

Shortcode Attributes

  1. text=”” enter your text, for example: text=”Photoshop”, default is none.
  2. text_color=”” enter text color code, for example: text_color=”#ff0″, default is white #fff.
  3. background=”” enter wrap background color, for example: background=”#ff0″, default is #eee.
  4. progress_color=”” enter progress color, for example: progress_color=”#ff0″, default is #bbb.
  5. pc=”” enter percentage, for example: pc=”90″, default is 0%.
  6. width=”” enter wrap width size, for example: width=”200″, default is 100%.
  7. bottom=”” enter wrap margin bottom value, for example: bottom=”15″, default is 30px.

The Settings

wordpress progress bar settings

If you want to set default options, enter your custom values and custom color codes in settings page, after that ignore “Shortcode Attributes”, just use this shortcode:
[wp_progress_bar text=”my skill” pc=”75″] with your text=”” and pc=”” without style attributes.

Download Plugin