1. Once you are in your store management dashboard select the Storefront tab
2. Once you are in the Storefront settings, select the Script Manager tab
3. Select Create a Script
4. Enter an appropriate name and description for the script
- Set location on page to “Head”
- Set select pages where script will be added to “Order confirmation”
- Set “Script category” to “Essential”
- Set script type to “Script”
5. Copy and paste the following ICS script in the “script contents” input box. See “ICS Quickstart Guide” for more information on how to customize ICS script further. This script initializes ICS widget on order confirmation pages. Once you have entered the entire script, save the script.
*important field. These should be enclosed in single quotes
campaignId : this number should match the campaignId on ICS admin. If you want to run a different campaign on order confirmation, you should change this value.
publicKey : universal whitelisted publicKey is d49bcd55f6954e86ab91730a5ea87d04 but an affiliate user can create and assign a unique one for each client from the ICS admin page.
<script>
fetch('/api/storefront/order/{{checkout.order.id}}', {credentials: 'include'})
.then(function(response) {
return response.json();
})
.then(function(myJson) {
var order = myJson;
var ICSCookie = null;
var ICSCookieObject = null;
function getICSCookie() {
var allCookies = document.cookie;
var regex = /invite=([a-zA-Z0-9%]+)/;
var matches = allCookies.match(regex);
if (matches) {
ICSCookie = matches[0];
}
};
getICSCookie();
ICSCookieObject = Object.fromEntries(new URLSearchParams(ICSCookie));
(function(i,s,r,publicKey,campaignId,a,m,frame,bodyChild){
i['IceCreamSocialObject'] = r;
i[r] = i[r] || function(){( i[r].q = i[r].q||[]).push(arguments)}, i[r].l = +new Date();
a = s.createElement('script'), m = s.scripts[0];
a.async = a.src = 'https://app.icecreamsocial.io/js/ics.js';
m.parentNode.insertBefore(a,m);
frame = s.createElement('iframe'), bodyChild = s.body.firstChild;
frame.src = 'https://app.icecreamsocial.io/?campaignId='+campaignId+'&publicKey='+publicKey;
frame.id='SocialIframe', frame.style.cssText = 'position:fixed;height:0%;width:0%;z-index:9999;border: 0';
bodyChild.parentNode.insertBefore(frame,bodyChild);
})(window ,document ,'ics', publicKey, campaignId);
ics('addTransaction', {
locale: 'en-US',
orderId: order.orderId,
email: order.billingAddress.email,
revenue: order.orderAmount,
// inviteCookie field is necessary to pass ICSCookie to track conversions properly on browsers with third-party cookies disabled.
inviteCookie: ICSCookieObject.invite,
// the following items are optional
name: order.billingAddress.firstName + ' ' + order.billingAddress.lastName
});
});
</script>6. Create another script by selecting “Create a Script” button.
7. Enter appropriate name and description for the script
- Set location on page to “Head”
- Set select pages where script will be added to “All pages”
- Set “Script category” to “Essential”
- Set script type to “Script"
8. Copy and paste the following ICS script in the “script contents” input box. This script will enable conversion tracking on browsers with third-party cookies disabled by setting ICS cookies as first-party cookies. Once you have entered the entire script, save the script.
<script>
function setICSCookies(){
var ICSRegex = /invite=([a-zA-Z0-9%]+)/;
var queryString = location.search;
var ICSQueryString = queryString.match(ICSRegex);
if (ICSQueryString) {
document.cookie = 'invite=' + ICSQueryString[ICSQueryString.length - 1] +'; Max-Age=30000000;' + 'Path=/';
}
}
setICSCookies();
</script>
9. You are good to go!
10. Once the ICS script is activated an ICS widget will pop up on the order confirmation page as shown below. You may wrap the ICS script in conditional statements tso that it only triggers if desired conditions of the purchases are met.