Shopify has a GDPR setting which you can enable under Preferences in your shopify backend. Read more about it here.
We have built a helper script you should add to your website to use the Shopify Api in connection with our cookie banner.
Put this script in the theme.liquid file and fill in the what category or script identifier (if using granular consent mode) needs to be accepted to enable Shopify tracking.
On the bottom of the file fill in your banner API code to enable the banner on your site.
<!-- Begin CookieFirst Shopify GDPR Api -->
<script>
window.Shopify.loadFeatures(
[
{
name: "consent-tracking-api",
version: "0.1",
},
],
function (error) {
if (error) {
console.error(error);
return;
}
function handleCFConsent(event) {
var consent = event.detail;
var required_categories = [
"performance",
// if using Category based consent fill in any of the categories: performance, advertising or functional
// if using Granular consent, add Zendesk in your scripts area. Use 'custom' code. And put the script identifier above.
];
var is_accepted = true;
for (var i = 0; i < required_categories.length; i++) {
var category = required_categories[i];
if (!consent || !consent[category]) {
is_accepted = false;
}
}
window.Shopify.customerPrivacy.setTrackingConsent(is_accepted, function() {});
};
window.addEventListener("cf_consent", handleCFConsent);
window.addEventListener("cf_consent_loaded", handleCFConsent);
// if you want to show the banner to all visitors, not only EU-visitors, change false to true
var show_outside_eu = true;
var show_banner = show_outside_eu || window.Shopify.customerPrivacy.shouldShowGDPRBanner();
if(show_banner) {
var banner = document.createElement("script");
banner.setAttribute(
"data-cookiefirst-key",
"API KEY HERE"
);
banner.src = "https://consent.cookiefirst.com/banner.js";
document.head.appendChild(banner);
}
}
);
</script>
<!-- End CookieFirst Shopify GDPR Api -->