← Back to changelog

GTM Kit Premium 1.7: Track the product lists and carts your theme builds itself

Premium

GTM Kit has always tracked the product lists and cart controls WooCommerce renders: shop and category archives, related and cross-sell lists, the product blocks, the add-to-cart buttons, the Mini Cart. Many stores no longer render those parts the WooCommerce way. Product grids come from a JavaScript framework, search results come from an index, recommendations arrive over AJAX, and the cart is changed with direct calls to the Store API. None of that passes through the hooks GTM Kit listens to, so none of it was reported.

GTM Kit Premium 1.7 gives those themes a supported way in, and follows the list a product came from all the way to the order.

Product lists your theme renders itself

Turn on Custom product list tracking API under GTM Kit → Commerce → WooCommerce: Event Customization. Then mark the list and its product cards:

<div data-gtmkit-list="Customers also bought" data-gtmkit-list-id="recommended_also_bought">
  <div data-gtmkit-item='{"id":123,"name":"Head Motion One","price":639}'>
    <a href="/product/head-motion-one/">Head Motion One</a>
    <button data-gtmkit-add-to-cart>Add to cart</button>
  </div>
</div>

GTM Kit sends view_item_list when the list is shown (by default when it scrolls into view, once per set of products), select_item when a product is clicked, and add_to_cart with the list attached when it is added from the list. Lists now carry item_list_id as well as item_list_name.

The events have the same shape as the ones GTM Kit sends for WooCommerce lists and go through the same runtime, so consent gating and the event deferral queue apply, and your GTM tags need no changes.

For server-rendered cards, gtmkit_product_item_attr( $product ) returns the attribute string to echo inside the card’s opening tag. For search indexes, gtmkit_product_item( $product ) builds the item once at index time, so the card sends the same item data the purchase will report later.

Every attribute, the JavaScript API and the details are in Track product lists your theme renders itself.

Cart changes made through the Store API

If your theme adds, updates or removes cart items with its own fetch calls to the WooCommerce Store API, hand each cart response to GTM Kit:

const cart = await response.json();
if ( response.ok ) {
    gtmkit.cart.sync( cart );
}

GTM Kit compares it with the cart it last reported and sends add_to_cart for every line that grew and remove_from_cart for every line that shrank, with the net quantity, the value and the full item data. Going from 1 to 3 is one add_to_cart with quantity 2. Nothing is sent on page load or for changes made in another tab, and an add already reported through the list API is not reported twice. gtmkit.cart loads with the list tracking API; there is no separate setting.

List attribution, sending the shopper straight to the checkout and the rest are covered in Track cart changes from a custom theme.

Revenue per product list

When a product is added from a tracked list, GTM Kit now stores the list on the cart line and copies it to the order. The items in view_cart, begin_checkout, add_shipping_info, add_payment_info and purchase, including the server-side purchase, carry the list the product came from. In GA4 that means the item list dimensions now reach item revenue, so you can see which lists actually sell, not only which ones get clicked.

If the same product is added from two lists, the most recent list wins. A filter keeps the first instead, if that matches how you think about attribution.

Consent from the GTM Kit consent bridge

GTM Kit 2.22 added the consent bridge: a Template Assistant tag that lets a consent banner running inside Google Tag Manager report the visitor’s choice to GTM Kit. Premium now uses it in two places.

  • Customer details on the server-side purchase. The consent stored with the order at checkout follows the visitor’s answer in that banner, so hashed customer details are sent only when advertising consent was given.
  • The event deferral queue releases held events as soon as the bridge reports consent, instead of waiting for its timeout.

Add the Consent Bridge from the Template Assistant to use either.

Fixes

  • Purchases held for consent are no longer lost when the shopper leaves early. In flush mode the deferral queue now sends what it is holding when the visitor leaves the page, so closing the tab on the order confirmation page before the timeout no longer drops the purchase. If you also send the server-side purchase when the browser does not confirm it, a purchase still held at that moment is left to the server instead: a push made while the page unloads cannot be confirmed, so this way the order is sent once, not twice.
  • Anonymized fallback purchases for shoppers who denied analytics consent. On stores that send the server-side purchase only when the browser does not confirm it, and anonymize webhooks by consent, these purchases were missing from the server side. They are now sent, anonymized.

German translation

GTM Kit Premium’s settings, notices and order screen are now available in German, alongside Danish and Spanish.

Requirements

GTM Kit Premium 1.7 requires GTM Kit 2.22.0 or later and will not run until GTM Kit is updated. Update GTM Kit first.