This article is intended for SMB clients who's data integration with Quicklizard is done via a price comparison service

# Variables

The SDK integration requires you to define the following variables inside the SDK's embed code:

Variable Purpose Page Availability
clientKey
  • Purpose - Identifies your site on Quicklizard
  • Value - Your site's domain name, without www and (dot) characters.
Product / Payment Confirmation
productId
  • Purpose - Global unique product identifier
  • Value - The global unique identifier used to identify your product with your price comparison data provider
  • Notes - Usually SKU, EAN, ISBN, barcode or DB primary key
Product / Payment Confirmation
shelfPrice
  • Purpose - Product shelf price
  • Value - The product's shelf price as seen by the user on your product page
Product
permalink
  • Purpose - provide link to your product page from Quicklizard's SaaS application
  • Value - product page permalink
Product
salePrice
  • Purpose - Used by Quicklizard to calculate revenue
  • Value - The final sale price of each sold product, after checkout
Payment Confirmation
Your SDK clientKey is usually provided by Quicklizard upon initial client setup - Please verify you are using the correct clientKey before publishing the SDK to your live site

# Step 1 - SDK Embed Code

Please copy the following two code snippets, and place them in your sites product and payment confirmation pages respectively.

# Product Page Embed Code

<script>
  window.QLAsync = function(QL){
    var clientKey = 'CLIENT_KEY',
        productId = 'PRODUCT_ID',
        shelfPrice = 0.0,
        permalink = self.location.href;
    QL.init(clientKey);
    QL.sendProductEvent(productId, parseFloat(shelfPrice, 10), permalink);
  }
</script>
<script src="//d3jdlwnuo8nsnr.cloudfront.net/sdk/v2.1/ql.js"></script>

# Payment Confirmation Page Embed Code

<script>
  window.QLAsync = function(QL){
    var clientKey = 'CLIENT_KEY',
        productId = 'PRODUCT_ID',
        salePrice = 0.0;
    QL.init(clientKey);
    QL.sendConfirmationEvent(productId, parseFloat(salePrice, 10));
  }
</script>
<script src="//d3jdlwnuo8nsnr.cloudfront.net/sdk/v2.1/ql.js"></script>

# Step 2 - Set variable values

For each code snippet, you must now replace variable placeholders with actual values from your database.

The following example shows you how to set the required variables inside your server-side templates for each page the SDK is installed on.

Note that for the sake of this example, it is assumed your server-side template language uses <%= %> tags to print content.
Please adjust the example to work with your server-side template language.

# Product Page Embed Code

<script>
  window.QLAsync = function(QL){
    var clientKey  = '<%= $clientKey %>',  // <---- define $clientKey in your server-side template code
        productId  = '<%= $productId %>',  // <---- define $productId in your server-side template code
        shelfPrice = '<%= $shelfPrice %>', // <---- define $shelfPrice in your server-side template code
        permalink = self.location.href;
    QL.init(clientKey);
    QL.sendProductEvent(productId, parseFloat(shelfPrice, 10), permalink);
  }
</script>
<script src="//d3jdlwnuo8nsnr.cloudfront.net/sdk/v2.1/ql.js"></script>

# Payment Confirmation Page Embed Code

<script>
  window.QLAsync = function(QL){
    var clientKey = '<%= $clientKey %>', // <---- define $clientKey in your server-side template code
        productId = '<%= $productId %>', // <---- define $productId in your server-side template code
        salePrice = '<%= $salePrice %>'; // <---- define $salePrice in your server-side template code
    QL.init(clientKey);
    QL.sendConfirmationEvent(productId, parseFloat(salePrice, 10));
  }
</script>
<script src="//d3jdlwnuo8nsnr.cloudfront.net/sdk/v2.1/ql.js"></script>