You have 2 options for integrating Axeptio into your Shopify store.
With these installations, you can configure:
Your Axeptio project
Google's Consent Mode V2
Interaction with Shopify's consent API
Option 1 - via the Shopify app (Recommended)
Axeptio offers a Shopify application that will make your life easier.
The application installation is done in several steps:
Log in to your Axeptio account, you must log in with your login/password
Creation of a new project or connection to an existing project (Important step)
Activation of the embed app in Shopify which allows you to display our widget on the site
You are then on the control panel screen to customize the colors and information of your widget.
Configuring Google Consent Mode V2
The Axeptio app for Shopify is compatible with Google's Consent Mode V2. It sends Google default consent signals when the page loads, which apply until the visitor makes their choice in the widget.
In the Axeptio back office, open My banners, then the cookie banner for your store.
In the Consent Modes section, verify that Google Consent Mode v2 is enabled. It activates automatically as soon as your banner contains Google Analytics or Google Ads.
Click Save and close, then Publish.
In Shopify admin, open Apps > Axeptio > Consent mode v2.
In the What is Google consent mode v2? block, click Enable Google Consent Mode V2.
In the Default settings for consent mode block, choose from the dropdown list for each signal (Analytics Storage, Ad Storage, Ad User Data, Analytics Personalization) the value applied by default. For a site intended for a European audience, leave the value Refused (Recommended).
Each modification is saved automatically: there is no Save button.
Each parameter in the app corresponds to a signal in Google's Consent Mode:
Parameter in the app | Google signal |
Analytics Storage |
|
Ad Storage |
|
Ad User Data |
|
Analytics Personalization |
|
For the role of each signal and the choice between basic and advanced mode, see Configuring Google Consent Mode v2 (CMS integration).
To disable Consent Mode V2, click Disable Google Consent Mode V2 on the same page.
Option 2 - Via hard integration into your Shopify liquid template with the code provided by Axeptio in the "Integration on my site" section
Recommended if you have a specific need in integrating Axeptio.
The code to retrieve from Axeptio
<script type="text/javascript">
window.axeptioSettings = {
clientId: "v##{{Your Client ID to Modify}}",
};
(function(d, s) {
var t = d.getElementsByTagName(s)[0], e = d.createElement(s);
e.async = true; e.src = "//static.axept.io/sdk.js";
t.parentNode.insertBefore(e, t);
})(document, "script");
</script>
1 - Add the specific Shopify code
If your store is in French:
<script>
window.vendors_shopify = [
{
name: "shopify_preferences",
title: "Preferences",
shortDescription:
"Cookies that remember your preferences, such as country or language, to personalize your visits to our website",
policyUrl: "https://www.shopify.com/legal/terms",
domain: "shopify.com",
},
{
name: "shopify_analytics",
title: "Analytics",
shortDescription:
"Cookies to understand how you interact with our site",
policyUrl: "https://www.shopify.com/legal/terms",
domain: "shopify.com",
},
{
name: "shopify_marketing",
title: "Marketing",
shortDescription:
"Cookies to provide advertisements and marketing communications based on your interests",
policyUrl: "https://www.shopify.com/legal/terms",
domain: "shopify.com",
},
{
name: "shopify_sale_of_data",
title: "Sale of data",
shortDescription:
"Opt in / out of data sharing / sale",
policyUrl: "https://www.shopify.com/legal/terms",
domain: "shopify.com",
},
];
(_axcb = window._axcb || []).push(function (sdk) {
sdk.on("ready", function () {
if (!sdk.cookiesConfig) {
return;
}
// Construction of the Shopify step in the cookie widget
sdk.cookiesConfig.steps.splice(1, 0, {
hasVendors: true,
image: "cookie-bienvenue",
layout: "category",
message:
"Shopify uses several services and plugins, we can control them via their privacy API",
name: "welcome",
onlyOnce: true,
title: "Shopify Cookies",
subTitle: "Shopify uses several services, does this suit you?",
vendors: window.vendors_shopify,
});
// Shopify consent API
window.Shopify.loadFeatures([
{
name: "consent-tracking-api",
version: "0.1",
},
]);
});
// Update of the Shopify consent API
sdk.on("consent:saved", function (payload) {
const choices = payload.consent.preferences.vendors;
window.Shopify.customerPrivacy.setTrackingConsent(
{
preferences: choices.shopify_preferences,
analytics: choices.shopify_analytics,
marketing: choices.shopify_marketing,
sale_of_data: choices.shopify_sale_of_data,
},
() => {}
);
});
});
</script>
2 - Connect to your Shopify admin.
In the left menu, go to Online Store > Themes.
Click on the action menu and select "Edit the code".
Copy the 2 code blocks just before the tag