Progress Map add-on will add the “Progress Map” submenu under the GamiPress menu.
Accessing to this menu you will be able to start configuring progress maps similar to WordPress post/pages views.
1 – Configuring the achievements
First you will need to configure the achievements to place in the progress map.
You will find this settings on the Progress Map Achievements box:
After choose some achievements, you can set the order which achievements will be displayed by dragging them.
2 – Display options
From the Progress Map Display Options box you will be able to set how the progress map will look as well as a great number of color pickers to change each progress map element color:
Hide Upcoming Achievements
Checking this option will hide the text of the upcoming achievements that the user has not been unlocked yet. A trick to keep always the relative order is set the previous achievement as requirement of the current one, something like to complete the 3rd achievement first user needs to complete the 2nd one.
3 – Achievements Display options
Inside the Progress Map Display Options box you will be able to configure how achievements will look with controls similar as you can found on the Achievement shortcode and/or widget.
Also, on the achievements display options will appear options added by other add-ons like “Show discounts” option added by the WooCommerce Discounts add-on or “Show progress” option added by the Progress add-on.
4 – Announcing a progress map
From the progress map settings page you can enable/disable the ability to access to a progress map as a page.
If you disable it, progress maps has the
[gamipress_progress_map] shortcode that allows you to place a progress map anywhere, including in-line on any page or post.
Also you can place any progress map on any sidebar through the GamiPress: Progress Map widget.
There is a example of a horizontal progress map:
And there is a example of a vertical progress map: