How to add Cc Circle Progress Bar in Wordpress

Simple circle animated progress bar. It will Show any progress data by animation. Wordpress Tutorial

Noted That:

To install correctly this cc-circle-progress-bar.zip .
Fisrt Download the cc-circle-progress-bar.zip to your computer
Extract/Open cc-circle-progress-bar.zip to Your Computer.
Then, Find readme.txt file inside cc-circle-progress-bar.zip and Open readme.txt .
Now, Read the Requirements of this plugin. Which Wordpress Version and PHP Version are required to run this Plugin in Your Wordpress Site.
Then, Follow the Tips Below.

Start the Tips:

Step-1 : Download " cc-circle-progress-bar.zip " to Your Local Computer.

Step-2 : Then, Login to your " yourdomain.com/wp-admin " Dashboard.

Login to Wordpress Cc Circle Progress Bar

Step-3 : Then, Click on " Plugins " + " Add New " from left Side Menu of Dashboard.

Go to Plugin Install Cc Circle Progress Bar

Step-4 : Now, Click on " Upload Plugin " button.

Click Upload Button Cc Circle Progress Bar

Step-5 : Now, Browse " cc-circle-progress-bar.zip " Downloaded plugin from your computer, Where you downloaded " cc-circle-progress-bar.zip " According to Step – 1 Above then, click on " Install Now "

Step-6 : Now, Click on " Active Plugin "

Step-7 : Then, See left Side Menu. " Cc Circle Progress Bar " folder is added on left Side Menu. Now, Click on " Cc Circle Progress Bar " folder.

Noted that: If you do not see " Cc Circle Progress Bar " folder on left Side Menu then, see at left Side Menu " Settings " or " Tools ".

Step-8 : Now you configure yourself oR Watch video tutorial below about Cc Circle Progress Bar Configurations and Settings or How to work " Cc Circle Progress Bar " in your WordPress site.

After Activated Plugin According to Step-6 then,

Go to " Plugins " + " Installed Plugin " from Wordpress Admin Panel Leftside Menu.
or Direct go to: https://yourdomain/wp-admin/plugins.php
Then, Find " CC Circle Progress Bar " Activated Plugin from Plugin List.
Then, Click on " Settings " from Plugin that is CC Circle Progress Bar
Now, Edit/Add/Config the setting and Click on " Save Changes " button,

Guide

Guide
This section describes how to install the plugin and get it working. Simple usage instruction: a. Upload `plugin-name.php` to the `/wp-content/plugins/` directory. b. Install This plug in your WordPress Site. c. Activate the plugin through the ‘Plugins’ menu in WordPress. Usage `[progressbar]` this shortcode where you want to use it. You can control this shortcode via attributes. There is all attributes. id=”1? => ID of every progressbar. Default value `1` . Must change this value if you add more then one progress bar in post or page. dimen=”250? => Height and width. Default value `250` . You can control height and width via this. text=”90%” => Text in the circle. Default value `90%` . Change it with your text or you can keep it blank if you don’t wanna put any text. info=”Photoshop” => Information of the circle, it shown under text. Default value `Photoshop` . Change it with your text or you can keep it blank if you don’t wanna put any text. width=”10? => Thickness of bar. Default value `10` . You can change it with your with your value. fontsize=”25? => Font size of text. Default value `25` . You can change it with your with your value. percent=”90? => Percent of progress. Default value `90` . You can change it with your with your value, value should be in 1 to 100. fgcolor=”#eee” => Foreground colour of progress. Default value `#eee` . You can change it with your with your value, value should be in RGB colour format start with Hash `(#)` . bgcolor=”#000? => Background colour of progress. Default value `#000` . You can change it with your with your value, value should be in RGB colour format start with Hash `(#)` . fillcolor=”#000? => Fill colour of progress. Default value `none` . You can change it with your with your value, value should be in RGB colour format start with Hash `(#)` . type=”full” => Type of progress. Default value `full` . You can its value as `half` of `full` for showing half or full view of progressbar. border=”outline” => Border type of progress. Default value `outline` . You can its value as `outline` of `inline` . So, what right now? ???? It example time. Example 1: Without any attribute. [progressbar] Example 2: With every attribute. [progressbar id=”1? dimen=”250? text=”90%” info=”Photoshop” width=”10? fontsize=”25? percent=”90? fgcolor=”#eee” bgcolor=”#000? fillcolor=”#000? type=”full” border=”outline”] Example 3: For inline border. [progressbar id=”1? dimen=”250? text=”90%” info=”Photoshop” width=”10? fontsize=”25? percent=”90? fgcolor=”#eee” bgcolor=”#000? fillcolor=”#000? type=”full” border=”inline”] Example 4: For half circle. [progressbar id=”1? dimen=”250? text=”90%” info=”Photoshop” width=”10? fontsize=”25? percent=”90? fgcolor=”#eee” bgcolor=”#000? fillcolor=”#000? type=”half” border=”inline”] If you have any problem to use this plugin feel free to submit a ticket in plugin forum. You can use this in you theme by Place in your templates

This section describes how to install the plugin and get it working.

Simple usage instruction:

a. Upload plugin-name.php to the /wp-content/plugins/ directory.
b. Install This plug in your WordPress Site.
c. Activate the plugin through the ‘Plugins’ menu in WordPress.
Usage [progressbar] this shortcode where you want to use it.
You can control this shortcode via attributes. There is all attributes.
id=”1? => ID of every progressbar. Default value 1 . Must change this value if you add more then one progress bar in post or page.
dimen=”250? => Height and width. Default value 250 . You can control height and width via this.
text=”90%” => Text in the circle. Default value 90% . Change it with your text or you can keep it blank if you don’t wanna put any text.
info=”Photoshop” => Information of the circle, it shown under text. Default value Photoshop . Change it with your text or you can keep it blank if you don’t wanna put any text.
width=”10? => Thickness of bar. Default value 10 . You can change it with your with your value.
fontsize=”25? => Font size of text. Default value 25 . You can change it with your with your value.
percent=”90? => Percent of progress. Default value 90 . You can change it with your with your value, value should be in 1 to 100.
fgcolor=”#eee” => Foreground colour of progress. Default value #eee . You can change it with your with your value, value should be in RGB colour format start with Hash (#) .
bgcolor=”#000? => Background colour of progress. Default value #000 . You can change it with your with your value, value should be in RGB colour format start with Hash (#) .
fillcolor=”#000? => Fill colour of progress. Default value none . You can change it with your with your value, value should be in RGB colour format start with Hash (#) .
type=”full” => Type of progress. Default value full . You can its value as half of full for showing half or full view of progressbar.
border=”outline” => Border type of progress. Default value outline . You can its value as outline of inline .
So, what right now? ???? It example time.
Example 1: Without any attribute.
[progressbar]

Example 2: With every attribute.
[progressbar id=”1? dimen=”250? text=”90%” info=”Photoshop” width=”10? fontsize=”25? percent=”90? fgcolor=”#eee” bgcolor=”#000? fillcolor=”#000? type=”full” border=”outline”]

Example 3: For inline border.
[progressbar id=”1? dimen=”250? text=”90%” info=”Photoshop” width=”10? fontsize=”25? percent=”90? fgcolor=”#eee” bgcolor=”#000? fillcolor=”#000? type=”full” border=”inline”]

Example 4: For half circle.
[progressbar id=”1? dimen=”250? text=”90%” info=”Photoshop” width=”10? fontsize=”25? percent=”90? fgcolor=”#eee” bgcolor=”#000? fillcolor=”#000? type=”half” border=”inline”]
If you have any problem to use this plugin feel free to submit a ticket in plugin forum.
You can use this in you theme by Place in your templates

Name
How to add Altruja in Wordpress
How to add Persian Date Short Code in Wordpress
How to add Author Recommended Posts in Wordpress
How to add Smntcs Google Analytics in Wordpress
How to add Places in Wordpress