SEO, AdWords, affiliates, advertising, and promotions
Hi,
I've created a conversion action on Google Ads:
And according to the instruction, I have to add the code to the <head></head>.
Now if I add the 'Add to Cart' tracking code to theme.liquid, it triggers as soon as someone visits the website. It doesn't wait for the user to add something to cart. Which, I think, will not give the correct reports.
Where can I add these tracking codes such that they only trigger when the event happens? Or is it fine to add it to the theme.liquid?
Solved! Go to the solution
This is an accepted solution.
Hello Saba 13,
Thanks for your query.
I have audited your website thoroughly. I can see you don't have any GA4 schema datalayer to track the add to cart button for Gads tracking.
To track the add to cart event push the event in the datalayer
create a tag in the Google tag Manager to track the particular event.
for datalayer example :
GTM tag example for GAds add to cart event :
Feel free to ask any questions you may have.
Thanks
@Saba13
Can you share the website URL or preview link so I can check it?
Hi @Saba13
Add your tracking data layer code like this👇
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
$('.button-add-to-cart').on('click',function(){
// add your tracking datalayer code here
});
});
</script>
Okay I added the code to the above snippet, but the event is still triggering as soon as I land on the website. It doesn't wait for me to add something to cart.
Should I add the event snippet to the above script code you sent as well?
I'm testing this in the tag assistant and as soon as the homepage loads, it says the tag has been detected. I'm not sure if this is the correct way to test?
Hi @Saba13
Can you share me the add to cart tracking script you are using so that I can have a better idea and also can share you the complete code
This is the full code with the snippet you provided:
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
$('.button-add-to-cart').on('click',function(){
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-11391563095"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-11391563095');
</script>
});
});
</script>
<!-- Event snippet for Add to cart conversion page -->
<script>
gtag('event', 'conversion', {'send_to': 'AW-11391563095/F5niCKbe2LgZENfq9bcq'});
</script>
I'm not sure if I should add the event snippet your code as well. I added this code just above the </head> in my theme.liquid
Hi @Saba13
This is not the add-to-cart tracking code.
This is the initialization of the google data layer code.
This doesn't need any event to fire.
It will fire on the page load
Undo the changes and keep the code as it is and check the below code
The actual add to cart data layer tracking code will be something like this 👇
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
$('.button-add-to-cart').on('click',function(){
dataLayer.push({ 'ecommerce': null });dataLayer.push({
'event': 'add_to_cart',
'ecommerce': {
value: {{ product.price | times: 0.01 }},
'items': [{
'item_id': '{{ product.id }}',
'item_name': '{{ product.title | remove: "'" | remove: '"' }}',
'item_brand': '{{ product.vendor | remove: "'" | remove: '"' }}',
'item_category': '{{ product.collections[0].title | remove: "'" | remove: '"' }}',
'item_variant': '{{ product.selected_or_first_available_variant }}',
'currency': '{{ shop.currency }}',
'price': '{{ product.price | times: 0.01}}'
}]
}
});
});
});
</script>
Replace below code
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
$('.button-add-to-cart').on('click',function(){
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-11391563095"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-11391563095');
</script>
});
});
</script>
TO this
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-11391563095"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-11391563095');
</script>
I got the above code from Google Ads
Is this the general Google Tag code?
If so, does this mean I don't actually need to add this code and my conversion action should work regardless?
I'm sorry I'm a bit confused now.
This is an accepted solution.
Hello Saba 13,
Thanks for your query.
I have audited your website thoroughly. I can see you don't have any GA4 schema datalayer to track the add to cart button for Gads tracking.
To track the add to cart event push the event in the datalayer
create a tag in the Google tag Manager to track the particular event.
for datalayer example :
GTM tag example for GAds add to cart event :
Feel free to ask any questions you may have.
Thanks
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025