相信很多人的网站是用WordPress搭建的,如果你的网站是用 WordPress 做的,要如何在 WordPress 里加入 Google Tag Manager 代码呢?(这篇要介绍的做法不是使用外挂,而是直接修改程式码喔。)
说直接修改程式码,好像会让不懂程式的人怕怕!
别怕,站长我也不懂程式码,跟着以下的步骤,你也可以顺利埋设 GTM 程式码喔!
Step 1. 先登入 Google 代码管理工具(传送门:https://tagmanager.google.com)
Step 2. 在工作区找到我们要安装的 GTM 代码,GTM 代码位于右上方。
点击 GTM 代码后会看到要安装的程式码。
程式码分为两段,第一段要贴在 <head> 中,第二段要贴在 <body> 里。然后,每个页面都要贴到!!!但由于 WordPress 是用 php 写的,我们只要贴一次就可以了!
Step 3. 登入到自己网站的 WordPress 后台。
Step 4. 在“外观”底下找到“主题编辑器”。
接者,在右侧找到“主题页眉 (header.php)”
Step 5. 在主题页眉中,加入两段程式码。
<1> 在 <head> 后方加入 GTM 的第一段程式码。
<2> 在 <body> 后贴上 GTM 的第二段程式码。
<3> 更新档案。
Step 6. 怎么确认更新的档案有 GTM 码?
<1> 回到网站前台,重新整理网页后,在网页中按右键“检查”。可以透过“寻找”功能来找 GTM 代码,以下范例的 GTM 代码是 GTM-***。
正常来说会搜到两个符合,因为我们刚刚贴了两段的程式码,而这两段的程式码都有 GTM 代码,一个在 <head> ,一个在 <body> 里。
<2> 透过 Chrome 的扩充功能 Tag Assistant 查看。(传送门:Tag Assistant (by Google))
Step 7. 发布 GTM。
回到 Google 代码管理工具,在右上方找到发布,点击发布。
发布时可以设定发布的版本名称。
GTM 有个好处,就是在正式发布之前,可以先预览检查代码是否有问题。开启预览的位置在发布右边的箭头里。
点击预览之后, GTM 的工作区会显示“正在预览工作区”,这个时候利用“同一个”浏览器查看网页,就会在网页下方出现 GTM 的预览区块。
要关掉预览模式,只要回到 GTM 工作区,点击“离开预览模式”即可。
GTM 程式码到这边就安装完成了!接下来就是新增各个追踪代码,例如:Google Analytics、Adwords、FB 像素、再行销、电子商务等等,或是设定事件追踪。
WordPress 也有 GTM 相关的外挂,请自行搜索啰!