Loading...
Counter Box 2017-01-12T21:28:09+00:00

Counter Box Element

Avada includes multiple animated counter elements, including the counter box element. These are great for displaying varying types of data and content to your viewers. The counter boxes include several options for easy customization and they are a great way to display content and attract the viewers eyes as they animate into the screen viewport.

0
Wonderful Users & Counting
0
Support Tickets Resolved
0
Cups of Hot Coffee

Control all text styles

Counter boxes allow you to control every color needed from borders, to title and body text and also font awesome icons. In addition, you can also control the sizes of fonts and icons.

0
WONDERFUL USERS & COUNTING
0
CUPS OF COFFEE
0
Support Threads Resolved
0
Hours of Development

Font Awesome Icons

Each counter box instance can display a font awesome icon with the content.

0
Hours of Development
0+ Vector Icons
Use Any of The Font Awesome Icons
0
Cups of Coffee
0
Wonderful Users & Counting
0
Support Threads Resolved
0
Hours of Development

Unit Control

Each counter box instance can have a different unit and unit position.

$0
Use Any Symbol Or Text For The Unit
0%
Use Any Symbol Or Text For The Unit
0lbs
Use Any Symbol Or Text For The Unit

Count Up or Down

Each counter box can have the animation number start up or down.

0
This Counts Up
13000
This Counts Down

Border Control

Each counter box instance can display a border around the box, also you can change the border color.

0
This Counter Box Displays A Border
0
This Counter Box Displays No Border

Complete Set of Options

Every option and description included with the Counter Box Element is listed below.

  • columns -Can be one of these values: 1, 2, 3, 4, 5 or 6. Sets the number of columns per row.
  • color – Accepts a hexcode ( #000000 ). Sets the color of the counter value and icon. Leave blank for Theme Option selection.
  • title_size – Accepts a pixel value. For example, 20px. Sets the title’s font size.
  • icon_size – Accepts a pixel value. For example, 5px. Sets the size of the icon.
  • icon_top – Can be one of these values: default, no or yes. Sets the position of the icon.
  • body_color – Accepts a hexcode ( #000000 ). Sets the color of the counter body text. Leave blank for Theme Option selection.
  • body_size – Accepts a pixel value. For example, 5px. Sets the font size of the counter body text.
  • border_color – Accepts a hexcode ( #000000 ). Sets the color of the counter box border. Leave blank for Theme Option selection.
  • animation_offset – Can be one of these values: default, top-into-view, top-mid-of-view, or bottom-in-view. Sets when the animation starts.
  • value – Accepts a numerical value. For example, 100. Sets the number to which the counter will animate to.
  • delimiter – Accepts a symbol. For example, , (comma) or . (period). Sets a delimiter digit for better readability.
  • unit – Accepts a symbol. For example, %. Sets the unit for the counter.
  • unit_pos – Can be one of these values: prefix or suffix. Sets the unit’s position.
  • icon – A font awesome icon value. For example, fa-glass.
  • direction – Can be one of these values: up or down. Sets the counter direction.
  • element visibility – Choose to show or hide the element on small, medium or large screens. Show them on all, or just some, givine you full control over all screen sizes. Each screen size also has a custom width setting in Fusion Theme Options.

  • class – Add a custom class to the wrapping HTML element for further css customization. Please refer to this documentation section.
  • id – Add a custom id to the wrapping HTML element for further css customization. Please refer to this documentation section.

Join The 370,000+ Satisfied Avada Users!

BUY AVADA NOW!

Sliding Bar Section For Widgets

This is the sliding section that can be enabled or disabled on any demo. You can insert anywhere from 1-6 columns along with any widget that comes with Avada, WordPress or additional 3rd party plugins. It's perfect for placing additional information on your site.

Recent Works

Contact Info

12345 North Street, New York City, NY 555555

Phone: 1-800-555-5555

Mobile: 1-234-567-8910

Fax: 1-234-879-5641

Web: http://yourwebsite.com