Add a counter

[vc_row type=”color” bg_color=”#e8e8e8″ vertical_align=”yes” column_gap=”no” padding_top=”” margin_top=”0″ margin_bottom=”0″ min_height=”220″][vc_column width=”1/2″][vc_empty_space height=”30px”][vc_column_text css=”.vc_custom_1476445749870{margin-bottom: -10px !important;}”]

Add and parameters a counter

[/vc_column_text][vc_column_text css=”.vc_custom_1476445777136{margin-right: 5% !important;}”]

The counter plugin allows you to quickly create a counter that highlight your annual reports, portfolios, presentations …

[/vc_column_text][/vc_column][vc_column width=”1/2″][vc_empty_space height=”90px”][vc_column_text css=”.vc_custom_1476445813045{margin-left: 5% !important;}”]

Here are the different options that we’ll cover in this tutorial:

[/vc_column_text][/vc_column][/vc_row][vc_row padding_top=””][vc_column width=”5/6″][vc_single_image image=”123″ img_size=”full” alignment=”center”][vc_empty_space height=”10px”][vc_row_inner][vc_column_inner width=”1/3″][vc_column_text]

First step: add a counter on a page

[/vc_column_text][vc_separator color=”custom” accent_color=”#009cad”][vc_column_text]

  1. To add a counter, click the “+” icon in the left menu of your page editor. An available media list appears, click on “add a counter.”
  2. The counter appears, you can now set it.

[/vc_column_text][/vc_column_inner][vc_column_inner width=”2/3″][vc_single_image image=”22863″ img_size=”full” onclick=”link_image” css=”.vc_custom_1475761040015{margin-right: 5% !important;}”][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner][vc_empty_space height=”50px”][vc_separator color=”custom” accent_color=”#e8e8e8″][vc_empty_space height=”30px”][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner width=”1/3″][vc_column_text]

Counter Parameters

[/vc_column_text][vc_separator color=”custom” accent_color=”#009cad”][vc_column_text]

  1. You can add a start and end value and duration to your counter animation.V
  2. You can display the “0”.
  3. You can set the text size, alignment and spacing the font.
  4. You can add various effects to your animation and trigger action to click on another page element!

[/vc_column_text][/vc_column_inner][vc_column_inner width=”2/3″][vc_single_image image=”22866″ img_size=”full” onclick=”link_image” css=”.vc_custom_1475761060036{margin-right: 5% !important;}”][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width=”1/6″][vc_empty_space height=”50px”][vc_widget_sidebar sidebar_id=”sidebar-1″][/vc_column][/vc_row][vc_row padding_top=”0″ padding_bottom=”0″][vc_column][vc_empty_space][vc_single_image image=”132″ img_size=”full” alignment=”center”][/vc_column][/vc_row][vc_row type=”color” bg_color=”#e8e8e8″ vertical_align=”yes” column_gap=”no” padding_top=”” margin_top=”0″ margin_bottom=”0″ min_height=”220″][vc_column width=”1/3″][vc_empty_space][vc_column_text]

More
tutorials:

[/vc_column_text][/vc_column][vc_column width=”1/3″][vc_empty_space height=”65px”][vc_column_text]

[/vc_column_text][/vc_column][vc_column width=”1/3″][vc_empty_space height=”65px”][vc_column_text]

[/vc_column_text][/vc_column][/vc_row]

Saving

Log in with your credentials

or    

Forgot your details?