sandbox/client-side-tag-manager-with-custom-loader.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Client side Google Tag Manager with custom loader</title>
    <!-- Google Tag Manager -->
    <script>
        (function (w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://sst-test.greenpeace.es/olpjosud.js?st=' + i + dl + ''; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', 'KM925DBR');
    </script>
    <!-- End Google Tag Manager -->
    <script>
            window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('consent', 'default', {
              'ad_storage': 'denied', // V1
              'analytics_storage': 'denied', // V1
              'ad_user_data' : 'denied', // V2
              'ad_personalization':'denied' // V2
            });
    </script>
    <script>
        function deleteCookie(name, domain) {
            document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/; domain=${domain}`;
          }
    </script>
</head>

<body>

    <h1>Client side Google Tag Manager with custom loader</h1>
    <p>This is a test to learn how it works. For now no events or tags exist in the client side GTM.</p>
    <p>The <a href="https://tagmanager.google.com/#/container/accounts/553476035/containers/187017593/workspaces/2" target="_blank">GTM-KM925DBR</a> is from a cient side container. The server sice container should be <a href="https://tagmanager.google.com/#/container/accounts/553476035/containers/187038479/workspaces/2" target="_blank">GTM-PC2TKKQ9</a>.</p>
    <p>The tracking domain is sst-test.greenpeace.es</p>

    <div>
        <button type="button"
            onclick="dataLayer.push({
                'event': 'Demo event', 
                'Demo propriety': 'ExampleDL' });">
                Demo event
            </button>
    </div>
    <div>
        <button type="button"
            onclick="deleteCookie('stape_mixpanel_initial_referrer','.greenpeace.es');">
                Delete stape_mixpanel_initial_referrer cookie manuallly
            </button> - This will move to client side GTM.
    </div>

</body>

</html>