Responsive Progress Bar

January 31, 2021

Responsive Progress Bar Plugin

Shortcode for displaying a responsive configurable progress bar.

A lightweight responsive progress bar which will work with your favourite HTML5 theme.

It works with major browsers, is configurable and only dependency is jQuery which is heavily used by WordPress themes.

Usage

Use the shortcode [rprogress] anywhere while editing your post or page. Below are some examples:

  • [rprogress value=80] displays a progress bar with value of 80%
  • [rprogress value=95 text=”Homework nearly completed”] writes a text as well
  • [rprogress value=75 color=”#ff0000″] uses red color for the progress bar
  • [rprogress value=70 color=”#00ff00″ delay=300] uses green color, draws the progress bar faster (default delay is 1000)

Below is a complete list of attributes with default values as well:

  • value (default = 100)
  • color (default = “#4af”)
  • bgcolor (default = “#cc” )
  • delay (default = 1000)
  • border_radius (default = “3px”)
  • text (default = “”)
  • text_color (default = “#333”)

Installation

  1. Download the latest version and extract it in the /wp-content/plugins/ directory.
  2. Activate the plugin through the ‘Plugins’ menu in WordPress.

To disable the shortcode, deactivate the plugin in the ‘Plugins’ menu in WordPress.

Screenshots

  1. Responsive Progress Bar in action

    Responsive Progress Bar in action

  2. Using the shortcode in WordPress editor

    Using the shortcode in WordPress editor

FAQ

N/A

N/A

Changelog

1.0

  • Initial version.

Details

  • Version: 1.0
  • Active installations: 200
  • WordPress Version: 3.5
  • Tested up to: 5.6.14

Ratings


5 Stars
4 Stars
3 Stars
2 Stars
1 Stars