Plugin: Milestone

To include Milestones on any page which you like you need to do three things:

1. Include jQuery on this page. http://jquery.com/download/
2. Add this JS code in page header:

<script>
jQuery(document).ready(function() {
  jQuery.getScript("https://example.com/amember/misc/milestone/get/misc/milestone/js", function(){
   jQuery('.am-milestone').amMilestones();
  });
});        
</script>

3. Wherever you want to display milestone you need to include this code: <div class='am-milestone' data-id="3" />

   data-id parameter sets milestone ID which should be displayed.

If a milestone's goal is not reached yet, plugin will display "not completed" template.

If goal was reached, plugin will display "completed" template.

Inside template you can use aMember's shortcodes to include goal, current and remaining values.

You can use html code in templates as well.