GTM Direct Click

AppsFlyerSDK · Mar 28, 2024 · cc48723 · cc48723
1 parent 069a47b
commit cc48723
Showing 1 changed file with 102 additions and 0 deletions.
diff --git a/examples/google_tag_manager_direct.html b/examples/google_tag_manager_direct.html
@@ -0,0 +1,102 @@
+<!-- This example will demonstare GTM with Direct Click URL -->
+<!-- Calling URL: https://appsflyersdk.github.io/af-onelink-smart-script/examples/google_tag_manager.html?my_source=email&app_dest=planes&typeid=b787&msg_id=f7h8 -->
+<!-- Expected OneLink URL: https://engmntqa.onelink.me/LtRd/?af_js_web=true&af_ss_ver=2_2_0&pid=email&deep_link_value=planes&af_sub4=f7h8&deep_link_sub1=b787 -->
+<!DOCTYPE html>
+<html>
+<head>
+  <!-- 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://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+  })(window,document,'script','dataLayer','GTM-NMBGJJXB');</script>
+  <!-- End Google Tag Manager -->
+
+  <!-- import the webpage's stylesheet -->
+  <link rel="stylesheet" href="style.css">
+  <link rel="stylesheet" href="themes/prism.css"
+  />
+  <!-- Global site tag (gtag.js) - Google Analytics -->
+  <script async src="https://www.googletagmanager.com/gtag/js?id=G-RJJXZ6Q5BJ"></script>
+  <script>
+    window.dataLayer = window.dataLayer || [];
+    function gtag(){dataLayer.push(arguments);}
+    gtag('js', new Date());
+
+    gtag('config', 'G-RJJXZ6Q5BJ');
+  </script>
+</head>
+<body>
+  <!-- Google Tag Manager (noscript) -->
+  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NMBGJJXB"
+  height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+  <!-- End Google Tag Manager (noscript) -->
+
+  <div class="row">
+    <div class="column">
+      <img src="../images/appsflyerlogo.png" alt="AppsFlyer logo">
+    </div>
+    <div class="column" style="text-align:right;">
+      <img src="../images/onelinklogo.png" alt="OneLink logo">
+    </div>
+  </div>
+  <h1 class="primary-heading">
+    OneLink Smart Script V2
+  </h1>
+  <h2 class="secondary-heading">
+    OneLink Google Tag Manager Direct Click Demo
+  </h2>
+
+  <div class="url-container">
+    <div class="input_url-container">
+      <h2>Input URL</h2>
+      <h3>To edit: make changes to the input URL in the address bar and reload the page.
+        Changes you have made to the script below will be lost after reload.
+      </h3>
+      <textarea id="input_url" class="present_url" readonly>
+        No input URL
+      </textarea>
+    </div>
+    <div>
+      <h3>Code ran by Google Tag manager</h3>
+      <pre><code class="language-js">
+
+        @@@@@ I'll paste the final code later
+
+      </code></pre>
+    </div>
+    <div class="output_url-container">
+      <h2>Output URL</h2>
+      <textarea id="output_url" class="present_url">
+        No output from script
+      </textarea>
+    </div>
+  </div>
+  <div class="stores-wrapper">
+    <a id="ios_link" href="https://apps.apple.com/us/app/my-device-id-by-appsflyer/id1192323960">
+        <img class="appstore-image" src="../images/app_store.png" alt="app store link" >
+    </a>
+
+    <a id="andrd_link" class="appstore-image" href="https://play.google.com/store/apps/details?id=com.appsflyer.android.deviceid">
+        <img src="../images/play_store.png" alt="play store link">
+    </a>
+  </div>
+  <script type="text/javascript">
+    window.onload = function () {
+      document.getElementById('input_url').innerHTML = window.location.href;
+
+      var result_url = AF_SMART_SCRIPT_RESULT.clickURL;
+      if (result_url) {
+            document.getElementById('andrd_link').setAttribute('href', result_url);
+            document.getElementById('ios_link').setAttribute('href', result_url);
+            document.getElementById('output_url').innerHTML = result_url;
+      }
+
+    };
+  </script>
+  <script src="scripts/prism.js"></script>
+</body>
+
+</body>
+</html>
+