Displaying point awards for purchases on external ecommerce sites

Blank 2/11/2021 07:45 - 2/11/2021 07:45
Incentives Developers

Introduction

In order to integrate the functionality of displaying the points that can be awarded when making a purchase, you will need to make use of Kademi’s rewards-lib library. This library contains the function kpoints() that allows these points to show on an external site. Before continuing please ensure that rewards-lib is installed in both the account and website you wish to work with.

 

Method

First, we will need to add a script tag for the plugin. The URL should point to your Kademi website, in this example “mykademisite.com” followed by the path to the plugin:

 

<script>https://mykademisite.com/theme/apps/rewards-lib/externalPointsPlugin.js</script>

 

Here is an example of a page where you want to show the points:

 

HTML:

<div class="">

    <div class='product-tile' data-sku='ABC-123'>

        <h4>Product 1</h4>

        Points: <span class='num-points'></span>

    </div>

    <div class='product-tile' data-sku='ABC-124'>

        <h4>Product 2</h4>

        Points: <span class='num-points'></span>

    </div>

</div>

Output: 

Product 1

Points:

Product 2

Points:

 

We will be using the series called 'ecom-series' that has a Point Allocation Source named 'points-for-a-claim', which will assign 100 points for every product sold. Note that this is just an example, it can be used with other rule types.

 



Parameters

When calling this function we will need the following parameters:

 

  • pointsUrl: A URL to the function. This needs to include the URL to your Kademi website (in this example “mykademisite.com”) followed by the name of the function “points-calc”.
  • series: The name of the series which will capture the sales and award points.
  • pointsSelector: The CSS selector for the element where the points will be displayed.
  • participantsId: Id of the user.

 

Example Call

Here is a sample call to the function for the previous page:

 

$(".product-tile").kpoints({

   pointsUrl : "http://mykademisite.com/points-calc",

   series : "ecom-sales",

   pointsSelector : ".num-points",

   participantId : "joe-bloggs"

});

 

Result

The result should be something like this:

 

 

Note that the points can be checked on the user profile under the points tab: