Google 跟踪代码管理器 - 使 ID 动态化

Question

我需要在我的应用程序中实施 google 标签管理器。它是一个具有独立配置系统的多租户应用程序。

我已经设置 google 标签管理器和分析。我在正文页面下方添加了以下代码片段：-

<!-- Google Tag Manager -->
<noscript>
    <iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXX"
            height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<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=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window, document, 'script', 'dataLayer', 'GTM-XXXX');</script>
<!-- End Google Tag Manager -->

但是我需要根据加载的站点动态指定 id('GTM-XXXX')。有没有办法在 runtime/dynamically 的上述代码片段中提及 id？我需要在 iframe 和脚本中 replace/change ID。

另请注意，它是一个 angularJS 前端

Answer 1

iframe和脚本是互斥的；一种会在用户启用 Javascript 时发生（基本上一直如此），而另一种会发生在他们没有启用时（在这种情况下 Google 跟踪代码管理器会尽力而为，但可能不会跟踪一切都很好。您可以为每个构建单独的解决方案。

您只需要编写一个小函数，根据一些可识别的变量，决定部署哪个 GTM 代码，并分别替换该代码段或 iframe src。

Answer 2

嗯，我在这里可能是错的，但你可以只为你所在的当前页面存储一个全局变量（即 window.pageGTM = GTM-XXXXX），然后将该变量放入容器中片段。

Google 跟踪代码管理器 - 使 ID 动态化

Google Tag Manager - make id dynamic

google-tag-manager