WEB ELEMENT
COUNTER CIRCLE
WEB ELEMENT
COUNTER CIRCLE
We include multiple animated counter shortcodes, including the counter circle shortcode. These are great for displaying varying types of data to your viewers. The counter circles have several options that allow you to easily customize them to your needs. Wether its sales percentages, skill levels, promotional levels or other data sets, the counter circle shortcode is a great way to visually attract the viewer and display content.
The Counter Circle Shortcode Is Highly Customizable
Customization options for circle size, filled and unfilled color, scales, speed, counting direction and more!
Control Colors
Column Options
Unit Control
Count Up or Down
Font Awesome Icons
Border Control
Each counter box instance can display a border around the box.
Total Control Over Meta Data Display
With each blog shortcode comes a full set of options for meta data. These options allow you to enable or disable each different section of meta data, or the entire set together.
- Offset of Animation = Choose when the animation should start.
- CSS Class = Add a class to the wrapping HTML element.
- CSS ID = Add an ID to the wrapping HTML element.
- Filled Area Percentage = From 1% to 100%
- Filled Color = Controls the color of the filled in area. Leave blank for theme option selection.
- Unfilled Color = Controls the color of the unfilled in area. Leave blank for theme option selection.
- Size of the Counter = Insert size of the counter in px. ex: 220.
- Show Scales = Choose to show a scale around circles.
- Countdown = Choose to let the circle filling move counter clockwise.
- Animation Speed = Insert animation speed in milliseconds
- Counter Circle Text = Insert text for counter circle box, keep it short