Counter Boxes Element
Avada includes multiple animated counter elements, including the Counter Boxes 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. Read below to discover more about this useful little element.
How To Use The Counter Boxes Element
The Counter Boxes Element allows you to add animated counters anywhere on your site.
Step 1 – Create a new page or edit an existing one.
Step 2 – Add a container then select your desired column layout.
Step 3 – Click the ‘+ Element’ button to bring up the Elements window. Locate the ‘Counter Boxes’ element and click it to bring up its options window.
Step 4 – The options on the right hand side are Parent Options, which are largely styling options, and affect the whole series of counter boxes, while the individual counter boxes are configured on the left hand side. Make sure to view the Element Demo page, to fully appreciate the options on offer. If you want your counter boxes to fill the width of the column they are in, make sure the number of columns equals the number of counter boxes. If you have fewer, they won’t fill the column, and if you have more, they will display on a second row.
Step 5 – Once you have set all your Parent Options, you add Child Items on the left. Click the pencil icon to edit the existing item. The Child Item Options Panel appears. This is where you add the content for the individual Counter Boxes. The initial option is the Counter Value, plus there are options for Delimiters, Units, Unit Position, Icon, Counter Direction and the Counter Box Text.
Step 7 – Once you have added content to one counter box, you can then set up other counter boxes, either by duplicating existing ones, or creating new ones, by clicking on the Clone Item icon, or the + Counter Box button respectively.
Step 8 – Once you have completed adding your counter boxes, click Save. You will be returned to the edit page. You can preview the page to view the counter boxes, and you can always edit the element again to make changes.
Read below for a detailed description of all element options.
Location: The edit screen within each Element.
You can deploy as many individual Elements in pages and posts as you need, there is no limit. Within each of the Elements you will see a tab or tabs that house an array of options that make it possible for you to configure each Element independently, and greatly enhance your flexibility and creative options.
Note: The Default setting will use the global settings assigned for this element in your Theme Options > Fusion Builder Elements > Counter Boxes Element section. Also, please note that the displayed options screens below show ALL the available options for the element. If you have Avada’s Option Network Dependencies turned on, you will only see options relevant to your selections, and so the options screen may look somewhat different.
Add / Edit Settings
Location: WordPress Dashboard > Avada > Theme Options > Fusion Builder Elements > Counter Boxes Element
The Avada Advanced Options Network gives you amazing flexibility with additional Global Element Options that allows you to control individual Element default settings.