通常情况下我们会想通过用户在我们的网站上提交的表单,来收集用户提交的关键信息 。表单提交后可能信息就进入了另外一套系统,很难行程完整的数据链条 。
文章插图
今天我们就来解决这个问题!通过选择性的抓取一些数据并将其存储在Google Analytics中,你就可以更好的分析你的网站流量、创建细分甚至定义再营销受众列表 。用Google Tag Manager抓取表单提交信息实际上非常简单,在本文中,将会使用两种方法来监测此部分数据——使用dataLayer或者JS代码 。
使用dataLayer监测表单数据使用google tag manager可以对网站上的所有活动进行监测 。从本质上讲,所有这些活动情况都可以添加为不同的dataLayer对象,你就可以了解到访客来到网站上做出的全部互动行为 。这种方法在监测表单提交时也同样适用 。当访客提交了一个表单,这个表单的提交事件就会被作为表单字段提交到dataLayer 。GTM就会根据设置的表单提交触发器触发的代码收取数据 。
使用dataLayer抓取表单值,需要在GTM中进行以下操作:
首先要保证可以满足以下需求:
- ?你必须最少在GTM中已经建立了一个表单提交触发器 。
- ?你必须使用标准的html编写的表单 。
- ?你的表单必须在网站上是运行状态 。
文章插图
文章插图
开始收集数据!
首先打开表单提交的页面,当然你也可以使用上图中的表单来做一次测试 。当表单提交时,我们想立即让页面停止跳转的过程 。最简单的方法就是,同时按住Ctrl并点击提交按钮 。这样就可以提交表单,并在新的标签页上打开确认页面 。这时在回到之前的标签页,你就会看到这个页面上发生的所有事件 。
接下来,如果想要使表单已经提交,并且表单信息已经被添加到dataLayer上,为此,就需要使用浏览器中的开发者工具中的JavaScript Console 。在windows系统中可以使用快捷键F12或者Ctrl + Shift +J,在Mac中可以使用CMD+OPT+J 。
【谷歌表单自动填写(盘点8款优秀的国内外表单软】在控制台中,输入dataLayer,来查看页面上的DataLayer情况 。GTM会使用dataLayer来追踪页面上发生的所有活动 。每一次输入在dataLayer上都是页面上发生的一次新的“事件”或者“活动” 。因为我们刚提交了表单,所以dataLayer上记录的最后一个事件应该是表单提交信息 。如果你没有看到表单提交的事件,请检查GTM中的设置是否正确 。
文章插图
如上图所示,通过dataLayer中不同的属性,就可以确定出需要进行检测的数据项 。例如就可以抓取性别和国家相关数据 。
提取需要的信息如果你在dataLayer上看到这些信息,那么我们就可以在GTM中抓取到这些信息!在GTM中创建新的DataLayer变量,那么现在我们就可以从提交表单信息中抓取性别数据 。在这里我会将其命名为DLV contact form gender
在本文的案例中,“gender”的值被嵌套在gtm.element,5 field下 。所以我们插入gtm.element.5.value在dataLayer变量命中 。这个变量就会返回“gender”下的单选钮的选择情况数据 。
文章插图
同样,如果需要抓取“country”,就创建一个新的DataLayer变量,叫做DLV contact form country,将其变量名设置为gtm.element.9.value 。这个变量就会返回从下拉菜单中选择的“country”的情况 。
文章插图
最后就是预览检查代码是否正常触发之后就可以将代码正式发布 。现在你就已经成功的创建了dataLayer变量,你可以在任何需要使用该变量的情况下对该变量进行调取 。例如你可以使用{{DLV contact form country}}作为一个自定义维度,将其作为一个事件标签,或者可以将其用作触发器在GTM中触发其他适合的追踪代码 。
使用JS追踪表单值现在我们使用JS来实现同样的功能 。首先要在GTM中创建一个自定义JS变量,用以获取表单提交的数据信息 。在自定义JS变量中,我会使用一个CSS Selector来查找页面上的元素 。
在你的表单中,点击你需要追踪的fields,就会看到这个元素的id、class或者其他可以让我们可以使用CSS Selector确定该元素 。
- 免费分享其设置步骤 win7自动关机命令怎么设置
- 最近|从imagen到parti,谷歌又整了啥新活?
- 13年自动挡捷达二手多少钱 新捷达2013款报价及图片
- 云骥智行|探索自动驾驶技术前沿,云骥智行携手浙大团队斩获2022 CVPR Waymo挑战赛奖项
- 鸡舍自动饮水器怎么安装 初生雏鸡的饮水技术
- 免费教你设置流程 电脑时间怎么自动校准
- 小型全自动胶带包装机,胶带厂一年的利润多少
- 手机谷歌浏览器体验分享 手机谷歌浏览器怎么样
- 显卡|矿卡还能活多久?谷歌揭示真相:有企业广告断崖式暴跌
- nc送料机参数设置,冲压机的送料机不能自动