Step 13. How to implement GA4 remove from cart event in Shopify

Below, you will find instructions on how to do it using Google Tag Manager and data layer variables in Shopify.

Implement data layer variables in Shopify.

Actually if you have implemented properly variables and you already have all needed data in data layer that have to be sent to GA4.

However you need to implement event variable to be able to create add_to_cart trigger. To do that you have to add to your "remove from cart" button additional java script code. You have to find in your Shopify admin > Online store > Themes code snippet responsible for presenting "remove from cart" HTML element. It can be included in additional section template like: "cart.liquid".

1. When you find this HTML element you need to add in this following code to the onclick action:

dataLayer.push({
'event': 'remove_from_cart', 
'items': [{
           item_id: {{ item.variant.id }}, 
           price:{{ item.variant.price| money_without_currency }}, 
           quantity:{{ item.quantity }} 
         }]
}); 

2. Create trigger that we use to fire remove_from_cart tag. Go to trigger section and create new trigger:
   
   
   
   Create new “CE – remove_from_cart” trigger as follow:
   
   
3. Create GA4 – remove_from_cart tag in Google Tag Manger. Go to "Tags" and click "New" button to add new tag. 
   
   
   
   Name it "GA4 – remove_from_cart", then choose tag type and select "Google Analytics: GA4 Event", and your configuration tag that you have already created here: How to implement GA4 Configuration tag in Google Tag Manager? and set "Event Name" to "GA4 – remove_from_cart".
   Next step is to setup "Event Parameters" as follow:
   
   then choose your trigger that you have already created a while before (CE – remove_from_cart)
   
   and click "Save" button on the top right corner, and click "Submit" to published.

Lets go now to the next step of our guide which How to implement GA4 login event on Shopify.