如何在WordPress配置GTM4WP和设置GA4

在本教程中,图帕先生将告诉你如何使用Google Tag Manager For WordPress插件在WordPress上安装Google Tag Manager和绑定上GA4谷歌分析。

1. 设置GTM容器

让我们先在谷歌标签管理器上创建一个新账户。点击创建账户。

如何在WordPress配置GTM4WP和设置GA4

输入一个账户名,并选择国家。接下来,选择一个容器名称,并选择网络作为目标平台。最后,点击创建。

如何在WordPress配置GTM4WP和设置GA4

然后,接受谷歌标签管理器服务协议条款,并点击是。

接下来,让我们通过点击标签>新建来创建一个新的谷歌分析标签。

如何在WordPress配置GTM4WP和设置GA4

将其称为GA – Pageview,然后点击标签配置。

如何在WordPress配置GTM4WP和设置GA4

选择谷歌分析: 通用分析。

如何在WordPress配置GTM4WP和设置GA4

选择Pageview作为跟踪类型。在本教程中,我们不打算创建谷歌分析设置变量,所以让我们点击在这个标签中启用覆盖设置。

如何在WordPress配置GTM4WP和设置GA4

插入跟踪ID,回到Google Analytics,点击Admin > Property Settings并复制该值。

如何在WordPress配置GTM4WP和设置GA4

点击触发,选择所有页面,并保存该标签。

如何在WordPress配置GTM4WP和设置GA4

如何在WordPress配置GTM4WP和设置GA4

点击提交,在版本名称中输入Google Analytics Pageview,然后点击发布。

如何在WordPress配置GTM4WP和设置GA4

如何在WordPress配置GTM4WP和设置GA4

我们的容器已经准备好了。

2. 安装和配置gtm4wp插件

到WordPress网站的管理面板,点击插件,然后添加新的。

如何在WordPress配置GTM4WP和设置GA4

然后搜索谷歌标签管理器,安装并激活该插件,如下图所示。

如何在WordPress配置GTM4WP和设置GA4

我们应该设置的插件,点击设置。

如何在WordPress配置GTM4WP和设置GA4

我们需要的第一件事是我们的谷歌标签管理器容器ID。

如何在WordPress配置GTM4WP和设置GA4

打开谷歌标签管理器, 点击管理 > 安装谷歌标签管理器.

如何在WordPress配置GTM4WP和设置GA4

我们只需要GTM的ID,而不是整个代码。复制ID。

如何在WordPress配置GTM4WP和设置GA4

然后在插件的设置中粘贴代码,并点击保存更改。

如何在WordPress配置GTM4WP和设置GA4

正如你所看到的,有四个选项可用于容器代码的放置。这些放置方式决定将<noscript>部分的容器代码放在哪里,这部分代码只被添加到<body>中。它只在浏览器不支持JavaScript的罕见情况下运行。无论如何,主要的GTM容器代码将被放在我们所有页面的<head>部分。

确保谷歌标签管理器容器已被添加到这个网站。

回到谷歌标签管理器工作区,点击预览来刷新容器。

如何在WordPress配置GTM4WP和设置GA4

刷新网站后,我们可以看到,容器已经被添加到我们的网站上,而且谷歌分析标签也启动了。

如何在WordPress配置GTM4WP和设置GA4

我们还可以打开Google Analytics界面,点击Real Time > Overview,以验证它正在接收数据。

如何在WordPress配置GTM4WP和设置GA4

我们还可以检查其他信息,如位置、流量来源、内容等。

如何在WordPress配置GTM4WP和设置GA4

3. 设置插件,将数据送入数据层

这个插件不仅可以用来将谷歌标签管理器添加到我们的WooCommerce WordPress网站,而且还可以用来向数据层添加更多有用的信息。

我们看一下Google Tag Manager的预览窗口。我们可以在摘要部分看到一个消息事件,与默认的GTM事件一起。将 “Message “作为事件名称意味着,当数据层推送发生时,没有与事件键相关的名称。

如何在WordPress配置GTM4WP和设置GA4

如果我们选择Message事件并点击Data Layer,我们可以看到插件已经给它添加了三条信息。

如何在WordPress配置GTM4WP和设置GA4

我们同样可以使用该插件为我们提供数据层中的更多信息。

基本数据→帖子

在基本数据选项卡中,我们可以决定这个插件将什么样的信息推送到数据层中。

如何在WordPress配置GTM4WP和设置GA4

这些选项包括帖子类型、类别、标签、作者ID等。你可以根据你的喜好,启用所有或部分信息。让我们检查所有这些选项,并再次刷新网站。

如何在WordPress配置GTM4WP和设置GA4

我们可以像以前一样看到消息事件,但是点击数据层显示,更多的信息已经被推送到数据层了

如何在WordPress配置GTM4WP和设置GA4

基本数据 → 访客

我们还可以使用插件中基本数据下的其他标签,选择更多的信息推送到数据层。通过点击访客,我们将能够使登录状态、登录用户角色等被推送到数据层中。同样地,让我们选中所有这些,并刷新网站以看到新的信息。

如何在WordPress配置GTM4WP和设置GA4

我们可以在数据层里面看到与网站用户相关的新信息。

如何在WordPress配置GTM4WP和设置GA4

在我们继续介绍该插件的其他功能之前,让我们看看我们如何从谷歌标签管理器内访问和使用数据层中的信息。

我们可以把这些信息发送给营销和分析工具,或者用它们来决定发射哪些标签。

在这里,我想使用visitorType信息来避免跟踪网站管理员所做的页面浏览。这样,我们就可以通过只跟踪网站用户所做的页面浏览来提高我们的数据质量。

要访问数据层中的信息,我们需要在谷歌标签管理器中使用变量。点击变量>新建。

如何在WordPress配置GTM4WP和设置GA4

命名为DLV – visitorType,然后点击变量配置。

如何在WordPress配置GTM4WP和设置GA4

选择数据层变量。

如何在WordPress配置GTM4WP和设置GA4

输入数据层变量名称,这里是visitorType,然后点击保存。

如何在WordPress配置GTM4WP和设置GA4

通过点击刷新或预览刷新容器。

如何在WordPress配置GTM4WP和设置GA4

再次刷新网站,点击信息,然后导航到变量标签。我们可以看到列表中的DLV – visitorType变量。

如何在WordPress配置GTM4WP和设置GA4

简单地说,当消息事件发生时,谷歌标签管理器想评估DLV – visitorType变量的值。它进入数据层,寻找关键字:visitorType,并返回其值。现在我们可以将这个值用于任何目的。

4. 阻止一个标签被触发

我想为网站管理员屏蔽Pageview标签。这有多种方法,这里我将向你展示一个简单的方法。

创建一个新的触发器,将其称为Pageview – NOT Administrator,并将Page View作为触发器类型。因为我们不需要这个触发器在所有的页面上触发,所以我们应该点击一些页面浏览。

输入DLV – visitorType,不等于和管理员,然后保存该标签。

如何在WordPress配置GTM4WP和设置GA4

接下来,我们需要改变GA – Pageview标签,选择Pageview – NOT Administrator作为其触发器。

如何在WordPress配置GTM4WP和设置GA4

再次刷新容器和网站。现在我们可以看到,由于我们刚刚为它定义的限制,该标签在页面上没有被触发。

如何在WordPress配置GTM4WP和设置GA4

我们可以点击该标签,看看它没有被触发的原因。正如你在发射触发器部分看到的,DLV – visitorType标准没有被满足。

如何在WordPress配置GTM4WP和设置GA4

我们也可以通过点击变量来验证它。它显示,当Page View发生时,DLV – visitorType的值是 “administrator”,因此它阻止了标签被触发。

如何在WordPress配置GTM4WP和设置GA4

5. gtm4wp插件的其他功能

我们继续查看该插件的其他功能。

基本数据 → 谷歌广告

Google Ads是一个高级功能,包括一个dataLayer变量,所有dataLayer的值都存储在其中,可以用于Google Ads再营销。

如何在WordPress配置GTM4WP和设置GA4

基本数据 → 浏览器/操作系统/设备

浏览器/操作系统/设备让我们在dataLayer中访问用户的浏览器、操作系统和设备数据。例如,如果我们想只在移动设备上发射一个标签,这可能是一个有用的功能。不要忘了,这些都是测试版的功能,你应该在使用前对它们进行测试。

如何在WordPress配置GTM4WP和设置GA4

 

基本数据 → 网站

对于使用WordPress多站点环境的网站所有者,站点功能可以在dataLayer中包括站点ID和站点名称。

如何在WordPress配置GTM4WP和设置GA4

 

集成 > Contact Form 7

集成 > Contact Form 7标签中的选项让我们在用户成功提交表单后包含一个dataLayer事件。Contact Form 7应该已经在网站上安装并激活,以使该功能发挥作用。

如何在WordPress配置GTM4WP和设置GA4

集成 > WooCommerce

WooCommerce集成功能让我们把电子商务的具体信息以标准或增强型电子商务格式推送到数据层。例如,如果选择跟踪增强型电子商务选项,该插件将推送有关产品印象、产品细节浏览、添加到购物车等信息,这些信息可以在谷歌标签管理器中使用,以设置增强型电子商务跟踪。

如何在WordPress配置GTM4WP和设置GA4

我们在这里可以使用的另一个实用的、相当高级的选项是设置每个印象的产品数量。这对包含大量产品的收集页面很有用,因为一次将所有的产品印象点击发送到Google Analytics,可能会导致点击被拒绝,因为它达到了每个点击最大8KB的限制。但是使用这个功能,你可以把产品印象点击分成更小的部分,这样点击的大小就会保持在8KB以下,例如,选择一次发送8个产品的印象信息。

我们可以选择将购物车页面作为结账漏斗的第一步,选择购物车作为第一结账步骤,或者选择在数据层中推送所有购物车内容,以丰富我们追踪到Google Analytics的数据。

如何在WordPress配置GTM4WP和设置GA4

我们可以使用 “包括完整的类别路径 “选项来加强电子商务跟踪,也可以选择产品品牌使用的分类法,以根据品牌来组织产品。

如何在WordPress配置GTM4WP和设置GA4

数据层中的客户数据和数据层中的订单数据是其他实用的信息,我们可以根据我们的跟踪情况和我们想收集的电子商务数据来启用。我们还可以从收入中排除税收和运费,以便交易被记录为该产品的真实价值。

如何在WordPress配置GTM4WP和设置GA4

如何在WordPress配置GTM4WP和设置GA4

谷歌广告再营销将动态再营销变量添加到dataLayer中,也允许我们为产品ID选择一个前缀。

如何在WordPress配置GTM4WP和设置GA4

如果我们希望我们的谷歌分析数据与库存软件中记录的SKU相匹配,我们也可以选择使用SKU而不是产品ID。

 

在本教程中,我只激活跟踪增强电子商务选项。

现在让我们刷新页面并点击一个产品,看看会发生什么。我们可以在数据层中看到,一个包含名称和SKU等所有信息的电子商务对象已经被推送到数据层中。我们可以在谷歌标签管理器中使用这个,将产品的详细视图发送到谷歌分析。

如何在WordPress配置GTM4WP和设置GA4

接下来,让我们快速浏览一下该插件的其他集成功能。谷歌优化集成不仅允许我们在所有页面上安装谷歌优化,而且还可以帮助我们在页面上添加页面隐藏片段,以防止闪烁。

如何在WordPress配置GTM4WP和设置GA4

 

还有一些高级功能。其中有两个非常有用的选项:

包括浏览器 “不跟踪 “设置,为数据层添加一个值,表明用户是否要求不被跟踪。一些用户喜欢不被网站追踪,知道这一点有助于我们尊重他们的选择,使用这个数据层变量的值来防止营销和分析标签被启动。

此外,我们还可以激活尽早加载GTM容器选项,以确保谷歌标签管理器在页面加载期间最早启动。

如何在WordPress配置GTM4WP和设置GA4

我将讨论的最后一个功能是黑名单标签。你可以在这一部分看到两个选项,黑名单标签和黑名单宏。巨集以前是指我们目前在谷歌标签管理器中知道的变量。

如何在WordPress配置GTM4WP和设置GA4

引入Tag Manager工具是为了方便营销人员为营销目的向网站添加脚本,而不需要直接访问和改变网站的源代码。因此,不用写几行代码,我们就可以根据用户的活动发射一个标签,这给我们带来了很大的权力和灵活性。

这种灵活性有时会给我们的网站带来危险,因为任何有权限发布GTM容器的人都可以使用有可能破坏网站功能的标签。GTM4WP插件的黑名单功能给了网站所有者控制或黑名单的权力,营销人员可以通过网站上的Google Tag Manger容器发射哪些标签。

让我们考虑一下,我们不希望我们团队中的任何人能够在网站上发射任何类型的自定义HTML标签。首先添加一个新标签,将其称为CHTML – Test,并选择自定义HTML作为标签类型。写下下面的代码:

 

<script>
alert(“Hello World!”);
</script>

然后选择所有页面作为触发器,并保存它。

如何在WordPress配置GTM4WP和设置GA4

现在刷新容器和网站。我们可以在刷新页面后看到Hello World!的弹出窗口。

如何在WordPress配置GTM4WP和设置GA4

我们可以在插件设置中阻止这种标签,点击允许所有,除了下面的检查项目(黑名单),然后点击自定义HTML标签。

如何在WordPress配置GTM4WP和设置GA4

如何在WordPress配置GTM4WP和设置GA4

保存设置后再次刷新网站。这一次我们没有看到Hello World!弹出窗口,因为我们已经阻止了执行JavaScript代码的自定义HTML标签。我们还可以从数据层中看到,在pageview之前有两个新的信息被推送,它们是gtm.whitelist和gtm.blacklist。

如何在WordPress配置GTM4WP和设置GA4

我们还可以从标签中看到,我们创建的标签没有被启动。

如何在WordPress配置GTM4WP和设置GA4

这样,网站管理员可以阻止和限制团队在谷歌标签管理器内使用的标签或变量类型。一些可以被阻止的变量包括常量变量、第一方Cookie变量、URL变量等。

如何在WordPress配置GTM4WP和设置GA4

原创文章,作者:图帕先生,感谢支持原创,如若转载,请注明出处:https://www.yestupa.com/wordpress-gtm4wp-setting.html

(1)
打赏 微信咖啡 微信咖啡 支付宝咖啡 支付宝咖啡
上一篇 3月 26, 2023 上午10:23
下一篇 4月 30, 2023 下午4:30

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注