圭谷设计提醒您如何在 AMP 页面中添加百度统计
在 AMP 页面中添加百度统计与 MIP 同理,AMP 是 google 开发的一种构建网页快速呈现的静态内容的方式。AMP 中的 amp-analytics 组件 能够对页面中的用户数据进行分析。现在我们在 amp-analytics 组件中添加了百度统计的配置,实现了百度统计对 AMP 页面的支持。
在 AMP 页面中添加百度统计
与 MIP 同理,AMP 是 google 开发的一种构建网页快速呈现的静态内容的方式。
AMP 中的 amp-analytics 组件 能够对页面中的用户数据进行分析。现在我们在 amp-analytics 组件中添加了百度统计的配置,实现了百度统计对 AMP 页面的支持。
使用
首先,要想在 AMP 页面中使用amp-analytics 组件,需要将其所需要的脚本添加到 AMP 页面的 head 标签下:
<script async custom-element="amp-analytics"
src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
然后,将 amp-analytics 标签插入到页面 dom 中。amp-analytics 标签上必须添加属性 type 来告诉组件将统计数据发送到哪里;建议同时添加属性 id,这样可以识别是哪个 amp-analytics 元素(方便调试)。
<amp-analytics type="baiduanalytics" id="analytics1">
...
</amp-analytics>
由于不能直接调用百度统计的标准代码,您需要使用以下支持的功能进行日志统计,包括:用于网页跟踪的 pageview 用于点击事件跟踪的 event
网页跟踪
可以通过网页跟踪来衡量网站上特定网页获得的浏览次数,只需要将触发器 request 值设置为 pageview,同时需要配置网站的 token,即可发送网页浏览匹配。
<amp-analytics type="baiduanalytics" id="analytics2">
<script type="application/json">
{
"vars": {
"token": "你的token"
},
"triggers": {
"trackPageview": {
"on": "visible",
"request": "pageview"
}
}
}
</script>
</amp-analytics>
事件跟踪
“事件”是指可以独立于网页或屏幕的加载而进行跟踪的用户与内容进行的互动。将触发器 request 值设置为 event,并设置所需的事件类别和操作字段,即可发送事件匹配。
<amp-analytics type="baiduanalytics" id="analytics3">
<script type="application/json">
{
"vars": {
"token": "你的token"
},
"triggers": {
"trackEvent": {
"on": "click",
"selector": ".click",
"request": "event",
"vars": {
"category": "song",
"action": "play",
"label": "HeyJude",
"value": "300"
}
},
"scroll": {
"on": "scroll",
"selector": "body",
"request": "event",
"scrollSpec": {
"verticalBoundaries": [25, 50, 90],
"horizontalBoundaries": [90]
},
"vars": {
"category": "scroll",
"action": "scroll",
"label": "height",
"value": "25"
}
}
}
}
</script>
</amp-analytics>
需要在触发器的 vars 中设置的属性说明:
-
21 2023-03
-
21 2023-03
-
07 2023-01
-
30 2022-11
-
12 2022-05
-
29 2022-01
-
28 2021-12
-
23 2021-12
-
21 2021-12
- 青岛画册设计的准备工作有哪些
- 青岛网站设计需要注意的事项
- 一个大气的网站是怎么做出来的呢
- 青岛网站设计案例作品
- 青岛网站维护与青岛网站运维的区别
- 青岛logo设计公司怎么选?
- 青岛logo设计到底有多重要
- 什么样的青岛网站建设更具吸引力
- 青岛网站建设的内容管理
- 青岛画册设计多少钱一P
- 网站设计怎么做好
- 如何提高网站建设转化率
- 怎么做一个优秀的外贸网站
- 响应式网站有哪些优势
- 企业网站建设跳出率太高怎么办
- 精美的网站着陆页是怎么做的
- 网站托管和网站代运营之间的区别
- 如何进行网站建设,如何提高网站流量