Bar Counter

This module which is to generate a simple and stylish bar counter. You can't but love this after knowing exactly how to generate and configure this. Its just beyond simple. In a minute, you can have what you want to be made. Mostly used in presenting skills in portfolio sites, information of different batches of students in an institutional website and many other sites as well. Its totally hassle-free.

General Settings

• Add New : - Add New : A button to add new Bar. You can add Bars as many as you want to make a Bar Counter with this button.
• Duplicate : Clone the Bar with all its settings.

Once you click on a created Bar, a couple of settings will be appeared to configure below this.

• Title : The Name of the Item/ Bar. It will be displayed on the left-top side above the particular Item/ Bar.
• Percent : Define the amount of that particular Item/ Bar in numeric.

Percent data must be in the numeric form as I defined a little earlier. Otherwise, it will not generate the bar.

• Bar Color : You can choose the color of the particular bar with this option.
• Percentage Color : This option allows you to select the color of the Item/ Bar percentage.
• Bar Type : Choose the type of Bar. You can either select Striped or Striped Animated. If you choose none of those, by default it shows you a plain Bar of that Item.

Styles Settings

• Animation : You can set an animation of how you want the Bar Counter section to appear.
• Title Font : Customize the title font for the Bar Counter. You can choose from plenty of existing Google fonts and define its type ( Bold, Italic, and Underline, Uppercase, Lowercase, and Capitalize as well ), size, line height, and letter spacing.
• Border Radius : Allows you to set border-radius in pixel. Applying it, you can make the bar circular in the corner.
• Thickness : You can increase the width of the Bar by Increasing the amount of thickness.