We don’t recommend using GTM because it still allows Google to have a presence on your website. But if you have no choice in the matter, you can quickly drop Fathom in using the code below (filling in the Site ID with your own, of course). Google Tag Manager, along with Google Analytics, are also illegal.
Because of GTM’s limitations regarding JavaScript version ES6 and above, the following code snippets (taken from our events documentation) are specifically tailored for compatibility with GTM:Events for link clicks (targeting by ID):
<script> window.addEventListener('load', function(event) { fathom.trackEvent('widget purchase', { _value: 1000, // Value is in cents }); });</script>
Dynamic event names and values for Shopify (can be adapted for other platforms):
Copy
Ask AI
<script>// Set the PRODUCT_NAME and dynamicValue variables using Shopify's Liquid code{% if product.title %} window.PRODUCT_NAME = {{ product.title | escape }}; window.dynamicValue = {{ product.price | divided_by: 100 }}; // Example: Convert price to a numeric value{% else %} window.PRODUCT_NAME = 'Default Product Name'; // Provide a default name window.dynamicValue = 0; // Provide a default value{% endif %}</script><script> window.addEventListener('load', function(event) { var addToCartButtons = document.querySelectorAll('.add-to-cart-button'); // Replace with your actual selector addToCartButtons.forEach(function(button) { button.addEventListener('click', function(clickEvent) { var dynamicProductName = window.PRODUCT_NAME; var eventName = 'added to cart: ' + dynamicProductName; // Calculate the dynamic value based on your logic var dynamicValue = window.dynamicValue; // Track the event with the dynamic product name and value fathom.trackEvent(eventName, { _value: dynamicValue }); }); }); });</script>