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.
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.
//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.
<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>
Updated almost 2 years ago