主页 / coding / 问题 / 79486853
Accepted
Greg
Asked: 2025-03-05 22:50:47 +0800 CST

Google Tag Manager 正在破坏我用 Oxygen 构建的网站 (WordPress)

  • 772

在过去的一年里，我已经将 GTM 集成到我使用 Oxygen 构建的网站中，形式如下：

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXX');
  gtag('config', 'GTM-XXXXX');
</script>

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GT-XXXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Google Analytics 和 AdWords 运行正常——我当时专注于最大化点击次数。大约 1.5 个月前，我将策略改为最大化转化，并在网站上创建了多个转化事件，而无需修改代码。一切都很顺利——我注意到用户参与度显著提高，预算利用率下降。但这种情况只持续了一段时间。

几天前，转换停止了。GTM 无法被调试器检测到，即使它在面板中显示为已连接。因此，我尝试将网站上的代码更改为 Google 建议的代码：

<!-- 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-XXXXX');</script>
<!-- End Google Tag Manager -->

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

使用此版本，GTM 变得可见，并且在调试模式下测试时转换似乎可以正常工作。但是，出现了冲突，特别是与 Oxygen 插件有关 - 某些元素停止显示，甚至 Oxygen 编辑器也变得无法使用。此外，WP Maps Pro 插件处理的地图无法加载。

我尝试了所有方法——我分析了原始代码停止工作时所做的所有更改。我还修改了新代码，以防止它在 Oxygen 编辑器中加载，并确保它在所有其他脚本之后异步加载。然而，与地图的冲突仍然存在。我也不希望延迟加载对转换产生负面影响。

我也尝试通过各种插件添加 GTM，但每次从服务器加载 gtm.js 时，都会出现问题。

我还可以检查什么或者做什么？

//EDIT 根据要求从控制台添加屏幕截图。

控制台错误

wordpress

1 个回答

  1. Best Answer

    您以前使用的旧代码片段未加载或使用 GTM。至少在您展示的代码片段中。它使用了 gtag。Gtag 与 GTM 非常不同，最佳做法是不要像以前一样直接使用 gtag，而是让 GTM 自行隐式管理它。当 gtag 与 GTM 一起手动加载时，它可能会与 GTM 自身对 gtag 的初始化发生冲突。

    忽略 noscripts。完全不用它们也没关系。它不会在没有 JS 的情况下工作。这是 Google 一直喜欢的一种误导。

    当转换停止工作时，您只需仔细调试并恢复即可。相反，您改变了整个架构（如果您之前确实没有加载 GTM），这意味着您必须在 GTM 的 UI 中重新实现所有 gtag 逻辑。您可能已经安装了 GTM，并且同时加载了 gtag，但您没有在问题中引用 GTM 加载代码。这让我怀疑您可能加载了两次 GTM？我相信 GTM 可以解决这个问题。但是，请检查 DOM 中是否加载了两个 GTM 实例。

    现在来谈谈看似由 GTM 引起的功能问题。

    当然，GTM 有能力干扰页面。避免提交 document.writes 和使用 GTM 中的 dataLayer 以外的全局变量被认为是最佳实践，但并不是每个人都知道这一点。

    为您提供简单的调试步骤：

    1. 使用 devtools drawer 的网络请求阻止程序来阻止 gtm 加载，看看功能问题是否仍然发生。
    2. 如果仍然出现这种情况，则问题不在于 GTM，而在于您编辑模板/插件的方式。如果仍然出现这种情况，请转到 GTM 并开始禁用标签。
    3. 从暂停自定义 html 标签开始，然后切换到暂停使用任何自定义 javascript 变量的任何内容。暂停时，请继续检查以找出哪一个会干扰您的功能。
    • 0

相关问题