.png)
New Customer Events Conversion Tracking SOP
This SOP covers how to install purchase conversion tracking with enhanced conversions using the customer events tab in Shopify.
It works with Shopify’s new checkout extensibility update.
Step-By-Step Setup
Important
Before you set up conversion tracking with customer events, you should remove any instances of GTM code in your theme.liquid file and also from your checkout additional scripts box.
However, if you’re using GTM purchases as your primary conversion action, then you should leave your GTM code until you’re sure that the new setup with customer events is working for you. After that you can then clean up your theme.liquid file.
Open up Shopify
Navigate to Settings > Customer Events
Click ‘Add Custom Pixel’
Call it whatever you want that’s relevant so you know what it does.
E.g. Google Purchase Tracking
Open up the Customer Privacy box
If you’re not advertising in Europe, then you can set Permission to ‘Not required’
If advertising in Europe where consent mode v2.0 laws apply, then you will need to select ‘Required’ and make sure you have consent setup.
For ‘Data Sale’ select ‘Data collected qualifies as data sale’
Paste the code below into the ‘Code’ box. Making sure to change the highlighted values to match your own. This is explained further down.
const script = document.createElement("script");
script.setAttribute("src", "https://www.googletagmanager.com/gtag/js?id=AW-XXXXXXXXXXX");
script.setAttribute("async", "");
document.head.appendChild(script);
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag("js", new Date());
gtag("config", "AW-XXXXXXXXXXX", { "allow_enhanced_conversions": true });
analytics.subscribe("checkout_completed", async (event) => {
const enhancedConversionData = {
email: event.data.checkout.email,
phone_number: event.data.checkout.phone,
address: {
first_name: event.data.checkout.shippingAddress.firstName,
last_name: event.data.checkout.shippingAddress.lastName,
street: event.data.checkout.shippingAddress.address1,
region: event.data.checkout.shippingAddress.provinceCode,
postal_code: event.data.checkout.shippingAddress.zip,
country: event.data.checkout.shippingAddress.countryCode,
}
};
const checkoutData = {
send_to: "AW-XXXXXXXXXXX/YYYYYYYYYYYYYYYYYYYY",
transaction_id: event.data.checkout.order.id,
currency: event.data.checkout.currencyCode,
value: event.data.checkout.subtotalPrice.amount,
items: event.data.checkout.lineItems.map(item => ({
item_id: item.variant.product.id,
item_name: item.variant.product.title,
})),
};
gtag("set", "user_data", enhancedConversionData);
gtag("event", "conversion", checkoutData);
});
analytics.subscribe("search_submitted", async (event) => {
gtag("event", "search", { search_term: event.data.searchResult.query });
});
analytics.subscribe("product_viewed", async (event) => {
gtag("event", "view_item", {
currency: event.data.productVariant.price.currencyCode,
value: event.data.productVariant.price.amount,
items: [{
item_id: event.data.productVariant.id,
item_name: event.data.productVariant.product.title
}],
});
});
analytics.subscribe("collection_viewed", async (event) => {
gtag("event", "view_item_list", {
items: event.data.collection.productVariants.map(variant => ({
item_id: variant.id,
item_name: variant.product.title,
})),
});
});
analytics.subscribe("product_added_to_cart", async (event) => {
gtag("event", "add_to_cart", {
currency: event.data.cartLine.merchandise.price.currencyCode,
value: event.data.cartLine.merchandise.price.amount,
items: [{
item_id: event.data.cartLine.merchandise.id,
item_name: event.data.cartLine.merchandise.product.title
}],
});
});
Click ‘Save’ in the top right corner
Click ‘Connect’ in the lower right corner.
That’s the setup in Shopify done.
Open up your Google Ads dashboard.
Navigate to Goals > Conversions > Settings
You’ll see a section called “customer data terms” - open this and accept the terms
Below ‘Customer Data Terms’ you’ll see a section called “Enhanced Conversions” Tick the box to turn on enhanced conversions and select Google Tag from the dropdown that appears.
Navigate to Goals > Conversions > Summary
Click ‘New Conversion Action’
Select ‘Website’ and enter your domain, then press scan.
Scroll down and select ‘Add a conversion action manually
Select the category as ‘Purchase’
Select ‘Use different values for each conversion’
Extend the conversion windows to the maximum length.
For ‘Enhanced Conversions’, tick the box.
Untick this option
Click ‘Done’ and then ‘Save and continue’
Click ‘See event snippet’
You’ll see code that looks like this. The red underlined value is what you should replace the red highlighted code above with. The blue underlined value is what you should replace the blue highlighted code above with.
Then click done. You are now ready to go.
Important: As the pixel code is in a sandbox, there is no way to test your conversion action. So wait for your ads to run for a few days, then check the conversion again to see if it’s now active and measuring conversions.
Comments