How to set up Universal Client-Side Integration through Direct script integration
Follow the steps below to integrate ProfitMetrics Universal Integration through Direct script integration
There are two scripts to integrate:
- “pmOriginTrack.js” - this should be placed unmodified on all pages on the webshop
- “pmLogOrder.js” - this should be put on the order confirmation page. This requires adaptation
Integrating pmOriginTrack.js
This file should be loaded on all pages. This script captures the source of the visitor, along with the google analytics client id(if applicable). There are no configuration or modifications required for this script.
Integrating pmLogOrder.js
This script should be loaded on the order confirmation page shown to the customer after successful payment. This script contains a javascript function called “pmLogOrder(pid, orderspec)” that sends the order data + tracking data to profitmetrics.
This function takes two parameters, the profitmetrics website id, and the orderspec itself. The function then reads out the tracking data obtained by pmOriginTrack.js and sends it along automatically.
The profitmetrics website id, in the script referred to as “pmId” is specific to the website inside the profitmetrics account, so it is important to use the correct id for the website in case of multiple websites, as this has already been prefilled to the currently active website in the profitmetrics webinterface at time of download.
Orderspec specification
The orderspec is a json/JavaScript structure, and it looks something like this:
var orderspec = { id, // string orderEmail, // string shippingMethod, // string, optional priceShippingExVat, // number, optional priceTotalExVat, // number paymentMethod, // string, optional currency, // string products: [{ sku, // string qty, // number priceExVat // number }]}
Please note the data types to avoid problems. It is acceptable to provide a number to a field that specifies a string, but NOT the opposite.
A few things to note:
- The id field is the order id, and must be unique
- The product sku must be that of the fully qualified variant purchased, and identical to the sku/product id in the feed of products loaded into profitmetrics. It must not be an empty string.
- The currency must be in 3 letter ISO 4217 format, Examples: “DKK”, “EUR”, “USD”
- While some fields are optional, we strongly recommend filling out if at all possible, as these are required for certain features beyond the core profit calculations
Example orderspec’s
Example 1: Hardcoded
var orderspec = {
id: "123",
orderEmail: "testbuyer@webshop.com",
shippingMethod: "UPS",
priceShippingExVat: 79,
priceTotalExVat: 716,
paymentMethod: "Paypal",
currency: "DKK",
products: [{
sku: "tshirt11",
qty: 2,
priceExVat: 129
},{
sku: "jeans6423",
qty: 1,
priceExVat: 379
}]
}
Example 2: Realworld From datalayer+DOM, via google tagmanager
// read out datalayer transaction products, deserializing if requiredvar transactionProducts = dataLayer[0].transactionProducts;if( typeof dataLayer[0].transactionProducts === 'string' ) { transactionProducts = JSON.parse( dataLayer[0].transactionProducts );}// build up product array, taking care with price datatypevar pmProducts = [];for( i = 0; i < transactionProducts.length; i++ ) { pmProducts.push({ sku: transactionProducts[i].content_id, qty: transactionProducts[i].quantity, priceExVat: transactionProducts[i].priceexcludingtax.replace(",", "") });}// obtain these from the DOM as datalayer did not containvar orderEmail = document.getElementById("pmExtraData").getAttribute("data-orderemail");var shippingMethod = document.getElementById("pmExtraData").getAttribute("data-shippingmethod");// build orderspec with datavar orderspec = { id: dataLayer[0].transactionId, currency: 'DKK', shippingMethod: shippingMethod, orderEmail: orderEmail, products: pmProducts, priceShippingExVat: dataLayer[0].transactionShipping, priceTotalExVat: dataLayer[0].transactionTotal - dataLayer[0].transactionTax};
Note about embedding the scripts
It is fully supported to embed the scripts on the page either via for example google tagmanager, referencing the script to load as an external file, or embedding directly onto the pages. We very strongly recommend to embed directly on your order confirmation page, or via google tagmanager.
Note about transferring data via template+DOM
On some ecommerce platforms it may seem easiest to transfer the data required into the DOM via hidden div or similar. While this does indeed work, care needs to be taken in case data is put in the innerHTML of DOM elements, as apple browsers attempt to transform numbers of a certain length into tel: links, and in our experience SKUs on products can often be numerical and of same length as telephone numbers.