{"id":10522,"date":"2014-09-04T17:37:01","date_gmt":"2014-09-04T17:37:01","guid":{"rendered":"http:\/\/theme-fusion.com\/avadaxml\/?page_id=10522"},"modified":"2024-05-17T16:28:42","modified_gmt":"2024-05-17T16:28:42","slug":"counter-circle","status":"publish","type":"page","link":"https:\/\/kallipoli.org\/en\/counter-circle\/","title":{"rendered":"Counter Circle"},"content":{"rendered":"

Counter Circle Shortcode<\/h1>\n

Avada includes 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.<\/p>\n<\/div>

<\/div><\/div><\/div><\/div><\/div>
94%<\/div><\/div><\/div>
Users<\/div><\/div><\/div>
<\/i><\/div><\/div><\/div>
Avada<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div><\/div><\/div>

Control Colors<\/strong><\/span><\/p>\n

Each counter circle in the shortcode can have a different filled and unfilled color.<\/p>\n<\/div>

<\/div><\/div><\/div><\/div><\/div>
Full<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
Control<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
of<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
Colors<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div><\/div><\/div>

Control Size<\/strong><\/span><\/p>\n

Each counter circle in the shortcode can have a different circle diameter.<\/p>\n<\/div>

<\/div><\/div><\/div><\/div><\/div>
You<\/div><\/div><\/div>
Can<\/div><\/div><\/div>
Control<\/div><\/div><\/div>
The<\/div><\/div><\/div>
Circle<\/div><\/div><\/div>
Size<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div><\/div><\/div>

Show Scales<\/strong><\/span><\/p>\n

Each counter circle can display a set of scales which visually mark the values around the circle. Larger scales mark it the quarter values around the circle.<\/p>\n<\/div>

<\/div><\/div><\/div><\/div><\/div>
Show<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
Some<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
Scales<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div><\/div><\/div>

Count Up or Down<\/strong><\/span><\/p>\n

Each counter circle in the shortcode can have the filled animation start full (up) or empty (down).<\/p>\n<\/div>

<\/div><\/div><\/div><\/div><\/div>
Up<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
<\/i><\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
Down<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
<\/i><\/div><\/div><\/div><\/div>
<\/div><\/div><\/div><\/div><\/div>

Animation Speed<\/strong><\/span><\/p>\n

Each counter circle in the shortcode can have a different animation speed, which provides a visual variation.<\/p>\n<\/div>

<\/div><\/div><\/div><\/div><\/div>
You<\/div><\/div><\/div>
Can<\/div><\/div><\/div>
Control<\/div><\/div><\/div>
The<\/div><\/div><\/div>
Circle<\/div><\/div><\/div>
Speed<\/div><\/div><\/div><\/div>
<\/div><\/div><\/div><\/div><\/div>

Font Awesome Icons<\/strong><\/span><\/p>\n

Each counter circle can have text information or a font awesome icon inside the circle. The full font awesome shortcode can be used along with all of the icon options.<\/p>\n<\/div>

<\/div><\/div><\/div><\/div><\/div>
<\/i><\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
<\/i><\/div><\/div><\/div><\/div>
<\/div><\/div><\/div>
<\/i><\/div><\/div><\/div><\/div>
<\/div><\/div><\/div><\/div><\/div>

Complete Set of Options <\/strong><\/span><\/p>\n

Every option and description included with the counter circle\u00a0shortcode is listed below.<\/p>\n<\/div>

<\/div><\/div><\/div><\/div><\/div>