WP Pace Plugin
Create an automatic page load progress bar. Based on Pace - Automatic page load progress bar. Javascript by Zack Bloom CSS by Adam Schwartz.
Create an automatic page load progress bar. Based on Pace – Automatic page load progress bar. Javascript by Zack Bloom CSS by Adam Schwartz. Themes inspired by Mary Lou
See a working demo here: pace.jamesdbruner.com
Cool Features:
- Customize the color of the progress bar with an easy to use color picker
- Choose which progress bar ‘theme’ you want to use from a dropdown list
- Decide whether you want to have the progress bar on every page or use the shortcode to add it to just a few specific pages/posts
- The shortcode allows you to have different colored progress bars with varying themes on a page to page basis.
How to use the shortcode:
There are two attributes you can use
Example: [pace color="#29d9dd" theme="minimal"]
or just [pace]
will work fine. (the default color is #29d9dd and the default theme is minimal)
There are ten themes to choose from
- Minimal
- Flash
- Barbershop
- MacOSX
- Fill-Left
- Flat-Top
- CornderIndicator
- Bounce
- Big Counter
- Center Circle
Installation
How to get started:
- Upload
wp-pace.zip
to the /wp-content/plugins/
directory - Activate the plugin through the ‘Plugins’ menu in WordPress
- Navigate to the Plugins page and select Settings
- Choose the settings you would like then check the Sitewide option and save
- Alternatively you can uncheck the sitewide option and use the shortcode on any page or post
Screenshots
Settings Page
Big Counter Example
FAQ
How big is this plugin?
Currently it’s sitting at: ~43.3KB
This is largely due to the fact that every pace theme is included in this plugin. That’s not to say that every theme is loaded. Only the theme you choose is loaded onto your page.
Changelog
2.0
- Refactored the plugin to work within the pace class now
- Added 2 more effects Big Counter and Center Circle
- Minified the css for all of the efects
- Minified pace.js
1.0
- First commit
- Comes with a global option or you can use the shortcodes
- Customize the color and choose a theme for your progress bar(s)