Skip to content

Instantly share code, notes, and snippets.

@webhasan
Last active April 7, 2024 08:53
Show Gist options
  • Save webhasan/8cff6d8f12640b65631115b7b8eee846 to your computer and use it in GitHub Desktop.
Save webhasan/8cff6d8f12640b65631115b7b8eee846 to your computer and use it in GitHub Desktop.
Checkout DataLayer Modify
<!-- Google Tag Manager -->
<script>
(function (w, d, s, l, i) {
w[l] = w[l] || [];
w[l].push({ "gtm.start": new Date().getTime(), event: "gtm.js" });
var f = d.getElementsByTagName(s)[0],
j = d.createElement(s),
dl = l != "dataLayer" ? "&l=" + l : "";
j.async = true;
j.src = "https://www.googletagmanager.com/gtm.js?id=" + i + dl;
f.parentNode.insertBefore(j, f);
})(window, document, "script", "dataLayer", "GTM-xxxxxxx");
</script>
<!-- End Google Tag Manager -->
<!-- GTM DataLayer -->
<script>
var transactionId = "{{ order.order_number | replace: '#', '' | default: checkout.id | replace: '#', '' }}";
var order_number = "{{ order.order_number | replace: '#', ''}}";
var checkout_id = "{{ checkout.id | replace: '#', '' }}";
var trackedOrderIds = window.localStorage.getItem('trackedOrderIds') ? JSON.parse(window.localStorage.getItem('trackedOrderIds')) : [];
if(transactionId && !trackedOrderIds.includes(order_number) && !trackedOrderIds.includes(checkout_id)) {
dataLayerInit();
}
function dataLayerInit() {
window.dataLayer = window.dataLayer || [];
const eventPrefix = '';
const formatedItemId = true;
const dataSchema = {
ecommerce: {
show: true
},
dynamicRemarketing: {
show: false,
business_vertical: 'retail'
}
}
// customer information
const currentUser = {};
{% if customer %}
currentUser.id = {{ customer.id }};
currentUser.first_name = "{{ customer.first_name }}";
currentUser.last_name = "{{ customer.last_name }}";
currentUser.full_name = "{{ customer.name }}";
currentUser.email = "{{ customer.email }}";
currentUser.phone = "{{ customer.default_address.phone }}";
currentUser.new_customer = {% if customer.orders_count < 2 %}true{% else %}false{% endif %};
{% if customer.default_address %}
currentUser.address = {
address_summary: "{{ customer.default_address.summary }}",
address1: "{{ customer.default_address.address1 }}",
address2: "{{ customer.default_address.address2 }}",
city: "{{ customer.default_address.city }}",
street: "{{ customer.default_address.street }}",
zip_code: "{{ customer.default_address.zip }}",
company: "{{ customer.default_address.company }}",
country: "{{ customer.default_address.country.name }}",
country_code: "{{ customer.default_address.country_code }}",
province: "{{ customer.default_address.province }}"
};
{% endif %}
{% elsif checkout.customer %}
currentUser.id = {{ checkout.customer.id }};
currentUser.first_name = "{{ checkout.customer.first_name }}";
currentUser.last_name = "{{ checkout.customer.last_name }}";
currentUser.full_name = "{{ checkout.customer.name }}";
currentUser.email = "{{ checkout.customer.email }}";
currentUser.phone = "{{ checkout.customer.default_address.phone }}";
currentUser.new_customer = {% if checkout.customer.orders_count < 2 %}true{% else %}false{% endif %};
{% if checkout.billing_address %}
currentUser.address = {
address_summary: "{{ checkout.billing_address.summary }}",
address1: "{{ checkout.billing_address.address1 }}",
address2: "{{ checkout.billing_address.address2 }}",
city: "{{ checkout.billing_address.city }}",
street: "{{ checkout.billing_address.street }}",
zip_code: "{{ checkout.billing_address.zip }}",
company: "{{ checkout.billing_address.company }}",
country: "{{ checkout.billing_address.country.name }}",
country_code: "{{ checkout.billing_address.country_code }}",
province: "{{ checkout.billing_address.province }}"
};
{% endif %}
{% endif %}
if (currentUser.email) {
currentUser.hash_email = "{{ currentUser.email | sha256}}"
}
if (currentUser.phone) {
currentUser.hash_phone = "{{ currentUser.phone | sha256}}"
}
dataLayer.push({
customer: currentUser
});
// purchase event
const couponCode = [];
{% for discount_application in discount_applications %}
couponCode.push("{{ discount_application.title }}")
{% endfor %}
dataLayer.push({ ecommerce: null });
const dataLayerData = {
event: eventPrefix + "purchase",
ecommerce: {
transaction_id: "{{ checkout.order_number | replace: '#', '' | default: checkout.id | replace: '#', '' }}",
value: {{ checkout.total_price | times: 0.01 }},
tax: {{ checkout.tax_price | times: 0.01 }},
shipping: {{ checkout.shipping_price | times: 0.01 }},
discount: {{ checkout.discounts_amount | times: 0.01 }},
currency: "{{ checkout.currency }}",
coupon: couponCode.join(','),
items: [
{% for line_item in line_items %}
{
item_id: formatedItemId ? "shopify_{{ shop.address.country_code }}_{{ line_item.product_id }}_{{ line_item.variant.id }}" : "{{ line_item.product_id }}",
product_id: "{{ line_item.product_id }}",
variant_id: "{{ line_item.variant.id }}",
item_name: "{{ line_item.product.title }}",
{% if line_item.variant.title != "Default Title" %}
'item_variant': "{{ line_item.variant.title }}",
{% endif %}
discount: {{ line_item.line_level_total_discount | times: 0.01 }},
sku: "{{ line_item.sku }}",
price: {{ line_item.final_price | times: 0.01 }},
quantity: {{ line_item.quantity }},
item_brand: "{{ line_item.vendor }}",
item_category: "{{ line_item.product.type }}"
},
{% endfor %}
]
}
}
if(dataSchema.dynamicRemarketing && dataSchema.dynamicRemarketing.show) {
dataLayerData['dynamicRemarketing'] = {
value: dataLayerData.ecommerce.value,
items: dataLayerData.ecommerce.items.map(item => ({id: item.item_id, google_business_vertical: dataSchema.dynamicRemarketing.business_vertical}))
}
}
if(!dataSchema.ecommerce || !dataSchema.ecommerce.show) {
delete dataLayerData['ecommerce'];
}
dataLayer.push(dataLayerData);
window.localStorage.setItem('trackedOrderIds', JSON.stringify([...trackedOrderIds, transactionId]))
};
</script>
<!-- END GTM DataLayer ADB Data Enhancer -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment