Guides

Promotional Messaging

Product Detail Page

Increase conversions and average order value by highlighting your partnership with Credit Key with our promotional messaging on product detail pages.

2046

Requirements

The Credit Key Javascript SDK requires Node 8.x or higher and NPM 5.x or higher. Depending on your setup the following dependencies may also need to be present: babel-loader @babel/core @babel/preset-env node-sass

API keys are available via the Credit Key merchant portal

Install the Credit Key Javascript SDK

npm install creditkey-js

The Credit Key Javascript SDK can also be installed via a script tag using the UNPKG CDN. It is then available as a global variable ck or as a UMD module.

<script crossorigin src="https://unpkg.com/@credit-key/creditkey-js@latest/umd/creditkey-js.js"></script>
<div id="pdp"></div>

<script>

	var client = new ck.Client('merchant_public_key', 'platform');//platform - 'production' or 'staging'
	var charges = new ck.Charges(1000, 0, 0, 0, 1000);//Pass product price into the Charges object
	pdp.innerHTML = client.get_pdp_display(charges);

</script>

Cart Page

Increase conversions and average order value even more by highlighting your partnership with Credit Key with our promotional messaging on your cart page.

2074
//Assign product prict to variable
<script crossorigin src="https://unpkg.com/@credit-key/creditkey-js@latest/umd/creditkey-js.js"></script>       
          
<div id="cartPdp"></div>

<script>

	var client = new ck.Client('merchant_public_key', 'platform');//platform - 'production' or 'staging'
	var charges = new ck.Charges(1000, 0, 0, 0, 1000);//Pass product price into the Charges object
	cartPdp.innerHTML = client.get_cart_display(charges, 'center', 'center');//Optional params for text alignment

</script>

Apply Now Button

Use the Credit Key Apply Now method to launch an Apply Now modal experience anywhere on your site.

1648
<a href="#" onclick="launchModalapply()">Apply Now</a>
      
<div id="modal-pdp"></div>

<script>
    function launchModalapply() {
      var client = new ck.apply('merchant_public_key', 'modal', 'platform');//optional modal or redirect param, platform - 'production' or 'staging'
    }
</script>