Skip to content

Instantly share code, notes, and snippets.

@zagarskas
Last active September 16, 2022 21:04
Show Gist options
  • Save zagarskas/4549bce5fa14ad2c95bec6eef71b2f55 to your computer and use it in GitHub Desktop.
Save zagarskas/4549bce5fa14ad2c95bec6eef71b2f55 to your computer and use it in GitHub Desktop.
Shopify checkout page integration - Google Ads, GA4, UA, Google Merchant center survey, prevent duplication, send enhanced conversion data
<!--
replace all of the following:
XXX_GADS_ID_XXX - google ads ID [AW-1234567890]
XXX_CONVERSION_XXX - Google Ads conversion [asdfgqwert123456]
XXX_GA_ID_XXX - Google anayltics ID [G-1234567890]
XXX_MERCH_ID_XXX - Google merchant ID [1234567890]
Covers both Universal anayltics and GA4 - "in theory" (for now)
belongs stuffed into the checkout settings in shopify: https://YOURSITE.myshopify.com/admin/settings/checkout
-->
<!-- Global site tag (gtag.js) - Google Ads: XXX_GADS_ID_XXX example: AW-1234567890 -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XXX_GADS_ID_XXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'XXX_GADS_ID_XXX');
</script>
<!-- Event snippet for Purchase - shopify checkout page -->
<script>
{% if first_time_accessed %}
var enhanced_conversion_data = {
"email": "{{checkout.customer.email}}",
"phone_number": "{{checkout.customer.phone}}",
"first_name": "{{checkout.customer.first_name}}",
"last_name": "{{checkout.customer.last_name}}",
"address": [{
street: "{{checkout.shipping_address.street}}",
city: "{{checkout.shipping_address.city}}",
region: "{{checkout.shipping_address.province_code}}",
postal_code: "{{checkout.shipping_address.zip}}",
country: "{{checkout.shipping_address.country_code}}",
}]
};
window.enhanced_conversion_data = enhanced_conversion_data;
gtag('set', 'user_data', enhanced_conversion_data);
gtag('event', 'conversion', {
'send_to': 'XXX_GADS_ID_XXX/XXX_CONVERSION_XXX',
'value': {{ checkout.total_price | money_without_currency }},
'currency': 'USD',
'transaction_id': '{{ order_number }}',
'user_data': enhanced_conversion_data
});
{% endif %}
</script>
<!-- opt in survey for google shopping ----
<script>
window.renderOptIn = function() {
window.gapi.load('surveyoptin', function() {
window.gapi.surveyoptin.render(
{
// REQUIRED FIELDS
"merchant_id": XXX_MERCH_ID_XXX,
"order_id": "{{ order.order_number }}",
"email": "{{ checkout.email }}",
"delivery_country": "{{ shipping_address.country_code }}",
"estimated_delivery_date": "{{ order.created_at | date: "%s" | plus : 604800 | date: "%Y-%m-%d" | uri_encode | replace:"+","%20"}}",
});
});
}
</script>
<script src="https://apis.google.com/js/platform.js?onload=renderBadge" async defer></script>
<script>
window.renderBadge = function() {
var ratingBadgeContainer = document.createElement("div");
document.body.appendChild(ratingBadgeContainer);
window.gapi.load('ratingbadge', function() {
window.gapi.ratingbadge.render(ratingBadgeContainer, {"merchant_id": XXX_MERCH_ID_XXX});
});
}
</script>
<!-- Global site tag (gtag.js) - Google Analytics: XXX_GA_ID_XXX example: G-1234567890 -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XXX_GA_ID_XXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'XXX_GA_ID_XXX');
{% if first_time_accessed %}
gtag('event', 'purchase', {
"transaction_id": "{{order.order_number}}",
"value": {{total_price | times: 0.01}},
"currency": "{{ order.currency }}",
"tax": {{tax_price | times: 0.01}},
"shipping": {{shipping_price | times: 0.01}},
"items": [
{% for line_item in line_items %}{
"id": "{{line_item.product_id}}",
"name": "{{line_item.title}}",
"quantity": {{line_item.quantity}},
"price": {{line_item.line_price | times: 0.01}}
},{% endfor %}
]
});
{% endif %}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment