感谢您预览 Google 的新代码文档!此网站为公开 Beta 版。(反馈

安装 Google 跟踪代码管理器(适用于网页)

Google 跟踪代码管理器是一个跟踪代码管理系统,您可通过该系统快速轻松地更新您网站上的代码和代码段。启动 Google 跟踪代码管理器

本文介绍了适用于网页的跟踪代码管理器安装。对于其他平台,请参阅适用于 AndroidiOS服务器的安装文档。

在安装适用于网页的跟踪代码管理器时,您需要向自己的网页或移动应用添加一小段代码。这段代码可以让跟踪代码管理器触发跟踪代码,只需将跟踪代码插入网页或移动应用即可。

适用于网页的标准安装

大多数情况下,最简单的入门方法是在跟踪代码管理器中查找代码和相关说明。

  1. 创建 Google 跟踪代码管理器帐号和容器(如果您尚未执行此操作)。
  2. 在 Google 跟踪代码管理器中,点击工作区
  3. 在靠近窗口顶部的位置,找到您的容器 ID,格式为 GTM-XXXXXX。点击您的容器 ID 即可打开安装跟踪代码管理器窗口。
    GTMID
  4. 按照提供的说明复制代码并将其添加到所有网页上。第一个代码块最好紧跟在网页的起始 <head> 标记后面,或者放置在 <head> 中尽可能靠上的位置。这有助于确保您的跟踪代码管理器配置在网页的其余部分加载时可用且已准备就绪。
    跟踪代码管理器安装屏幕
  5. 添加数据层对象(可选,但建议执行)。借助数据层,您的代码配置能够发挥更强大的衡量功能。
  6. 发布您的容器。

跟踪代码管理器安装完成后,所有代码配置都会在跟踪代码管理器界面中执行。

适用于网页的自定义安装

在极少数情况下(例如,为内容管理系统创建新模板时或创建电子商务模板时),您可能需要编写自定义 gtm.js 代码。将以下代码添加到您网站的每个网页上尽可能靠近起始 <head> 标记的位置。GTM-XXXXXX 替换为您的容器 ID:

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

接下来,将下面这段代码添加到您网站的每个网页上起始 <body> 元素的后面,需紧跟着此元素放置。GTM-XXXXXX 替换为您的容器 ID:

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

获取针对特定产品的设置指南

点击下面的链接,即可了解如何针对特定产品设置跟踪代码管理器: