dataLayer<\/span> || [];<\/p>\nwindow<\/span>.dataLayer<\/span>.push<\/span>({'event'<\/span>: 'productView'<\/span>,'ecommerce'<\/span>: {'currencyCode'<\/span>: 'USD'<\/span>,'detail'<\/span>: {'products'<\/span>: [{'name'<\/span>: 'Product Name'<\/span>,'id'<\/span>: '12345'<\/span>,'price'<\/span>: '29.99'<\/span>,'category'<\/span>: 'Category Name'<\/span>,'quantity'<\/span>: 1<\/span>In this example:<\/p>\n
\nThe event<\/code> key triggers an event called 'productView'<\/code> that GTM will listen for.<\/li>\nThe ecommerce<\/code> object includes all relevant product information, such as name, ID, price, category, and quantity.<\/li>\n<\/ul>\nYou will need to adjust the data layer according to the specific events you want to track (e.g., add to cart, checkout, purchase).<\/p>\n
<\/span>Step 3: Create Custom Tags in Google Tag Manager<\/span><\/h3>\nOnce the data layer is implemented, you can create custom tags in GTM to capture and send this data to various analytics or marketing platforms, such as Google Analytics or Google Ads.<\/p>\n
<\/span>Example: Track Product Views with Google Analytics (GA4)<\/span><\/h4>\nLet\u2019s walk through the steps to create a tag for tracking product views in Google Analytics 4 (GA4) using GTM.<\/p>\n
\nCreate a New Tag in GTM<\/strong>:\n\nGo to Google Tag Manager<\/strong> and click on Tags<\/strong> in the left sidebar.<\/li>\nClick New<\/strong> to create a new tag.<\/li>\n<\/ul>\n<\/li>\nConfigure the Tag<\/strong>:\n\nChoose Tag Configuration<\/strong>, then select Google Analytics: GA4 Event<\/strong>.<\/li>\nIn the Configuration Tag<\/strong> section, select or create a GA4 configuration tag (you\u2019ll need a GA4 property set up in your Google Analytics account).<\/li>\n<\/ul>\n<\/li>\nDefine the Event Parameters<\/strong>:\n\nSet the Event Name<\/strong> to something descriptive, such as product_view<\/code>.<\/li>\nUnder Event Parameters<\/strong>, map the values from the data layer. For example:\n\nParameter Name<\/strong>: currency<\/code>, Value<\/strong>: {{Currency}}<\/code> (where {{Currency}}<\/code> is the variable that captures the currency code from the data layer).<\/li>\nParameter Name<\/strong>: item_name<\/code>, Value<\/strong>: {{Product Name}}<\/code> (map product name from the data layer).<\/li>\nAdd other relevant parameters, such as item_id<\/code>, price<\/code>, and quantity<\/code>.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\nSet the Trigger<\/strong>:\n\nClick on Triggering<\/strong> and select New Trigger<\/strong>.<\/li>\nChoose Custom Event<\/strong> as the trigger type.<\/li>\nSet the event name to productView<\/code> (or whatever event name you\u2019ve defined in the data layer).<\/li>\n<\/ul>\n<\/li>\nSave and Publish<\/strong>:\n\nClick Save<\/strong> to save your tag.<\/li>\nAfter testing the tag, click Submit<\/strong> and Publish<\/strong> to push the changes live.<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n<\/span>Step 4: Set Up Triggers for Other Custom E-commerce Events<\/span><\/h3>\nNow that you\u2019ve set up tracking for product views, you can repeat similar steps to track other custom e-commerce events such as add-to-cart<\/strong>, begin checkout<\/strong>, and purchase<\/strong>.<\/p>\n<\/span>Example: Track Add-to-Cart Events<\/span><\/h4>\n\nCreate Data Layer for Add-to-Cart<\/strong>: Push the add-to-cart event to the data layer:\n\n
javascript<\/div>\n
\n
\n
Copy code<\/button><\/span><\/div>\n<\/div>\n<\/div>\nwindow<\/span>.dataLayer<\/span>.push<\/span>({'event'<\/span>: 'addToCart'<\/span>,'ecommerce'<\/span>: {'currencyCode'<\/span>: 'USD'<\/span>,'add'<\/span>: {'products'<\/span>: [{'name'<\/span>: 'Product Name'<\/span>,'id'<\/span>: '12345'<\/span>,'price'<\/span>: '29.99'<\/span>,'category'<\/span>: 'Category Name'<\/span>,'quantity'<\/span>: 1<\/span>Create a New Tag for Google Analytics<\/strong>:\n\nFollow the same process as for the product view event, but set the Event Name<\/strong> to add_to_cart<\/code>.<\/li>\nUnder Event Parameters<\/strong>, use the data layer variables for product name, ID, price, and quantity.<\/li>\n<\/ul>\n<\/li>\nSet the Trigger<\/strong>:\n\nCreate a new Custom Event Trigger<\/strong> for the addToCart<\/code> event.<\/li>\n<\/ul>\n<\/li>\nSave and Publish<\/strong>:\n\nSave the tag and trigger, and then publish the changes.<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n<\/span>Example: Track Purchases (Transaction Events)<\/span><\/h4>\nFor purchases, you can track the details of completed transactions using the following data layer structure:<\/p>\n
\n
javascript<\/div>\n
\n
\n
Copy code<\/button><\/span><\/div>\n<\/div>\n<\/div>\nwindow<\/span>.dataLayer<\/span>.push<\/span>({'event'<\/span>: 'purchase'<\/span>,'ecommerce'<\/span>: {'currencyCode'<\/span>: 'USD'<\/span>,'purchase'<\/span>: {'actionField'<\/span>: {'id'<\/span>: 'T12345'<\/span>,