TutorialGravity Forms Progress Text and Progress Bar

Do you want to communicate progress in text on your site or show a progress bar based on your Gravity Forms entries? With the calculation and progress bar options in GFChart you can do that or with using the Count Add-on.

Example progress text

Currently, we released 4 Add-ons . Say that our final goal is to release 20 Add-ons.
It means that we are 4/20 = 20% on the way.

In the above text, we used our GravityWP – Count Add-on to count the number of released Add-ons and since we know our goal is 20, we know that every released add-on is 5%, so we can multiply our count of released add-ons by 5 to get the correct number. See here the code:

Currently, we released [gravitywp_count formid='1' filter_field='20' filter_operator='is' filter_value='released'] Add-ons. Say that our final goal is to release 20 Add-ons.  It means that we are [gravitywp_count formid='1' filter_field='20' filter_operator='is' filter_value='released']/20 = [gravitywp_count formid='1' filter_field='20' filter_operator='is' filter_value='released' multiply='5']% on the way. 

Example progressbar

For showing a progress bar on your site with information from Gravity Forms, you can the GFChart Add-on. Here you see the same example as in the above text, but with a progress bar:

Making a calculation in GFChart

In GFChart you first have to add a Calculation to count the number of (filtered) entries. You can also calculate other things, like the sum of a field (or a certain amount of money). It looks like this to make a calculation in GFChart:

Screenshot of getting started with your Calculation in GFChart.
Screenshot of getting started with your Calculation.
Screenshot of the Select data tab in GFChart, where you can count the number of entries (leave Field empty) and set filter options.
Screenshot of the Select data tab in GFChart, where you can count the number of entries (leave Field empty) and set filter options.
Screenshot of the Customiser tab in GFChart Calculation settings, where you can choose for a Number Format and rounding.
Screenshot of the Customiser tab in GFChart Calculation settings, where you can choose for a Number Format and rounding.
Screenshot of the Preview of your calculation in GFChart.
Screenshot of the Preview of your calculation in GFChart.

Making a progress bar in GFChart based on calculation

After your calculation is configured, you can create a progress bar:

Screenshot of starting with a Progress Bar in GFCharts.
Screenshot of starting with a Progress Bar in GFCharts.
Screenshot of Select data, selecting a Calculation chart in GFChart as Total and defining the Goal.
Screenshot of Select data, selecting a Calculation chart in GFChart as Total and defining the Goal.
Screenshot of the Customiser tab in GFChart, defining the Goal display format.
Screenshot of the Customiser tab in GFChart, defining the Goal display format.
Screenshot with the Preview of your Progress Bar based on Calculation.
Screenshot with the Preview of your Progress Bar based on Calculation.

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close