Hugo中使用Google Analytics

Google Analytics

使用Google Analytics,大致过程是:

  1. 注册账户
  2. 获取跟踪代码
  3. 添加代码到网页中
  4. 验证生效

注册账户

在Google Analytics官网,可以使用Google账户,直接注册。

获取代码与测试

注册后,在【管理】【媒体资源设置】【跟踪信息】【跟踪代码】页面,即可获得Tracking ID与代码。

<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>

其中,'UA-XXXXX-Y'就是Tracking ID。

也可使用异步跟踪代码,在支持async的浏览器使用。

<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>

添加到网站后,可以通过同页面上的【发送测试流量】来查看效果。

Analytics in Hugo

其实,在Hugo中不需要直接添加上述代码。

在文档页面《Hugo - Analytics in Hugo》中,可以看到Hugo已经直接支持Google Analytics了。

只需要两步,就可以简单使用Google Analytics。

首先,在config.toml中,设置Google Analytics的ID。 这个ID,既可称为媒体资源ID(Property ID),又可称为(Tracking ID)。

googleAnalytics = "UA-XXXXX-Y"

其中的"UA-XXXXX-Y"需要替换成实际的Tracking ID。

其次,在模板文件head.html中,添加以下内容:

{{ template "_internal/google_analytics_async.html" . }}

此后,在生成的页面中,就自动包含Google Analytics需要的代码了。

在调试时禁用Analytics

配置完成后,Google Analytics会上传任何页面的访问信息,包括本地hugo server调试时。 为了避免这种干扰数据,暂时没有太好的办法,只有一个歪招

{{ if not .Site.BuildDrafts }}
{{ template "_internal/google_analytics_async.html" . }}
{{ end }}

这样,在hugo server --buildDrafts时,就不会包含Analytics代码,产生上传数据。

后来,在Hugo v0.38以后,有一个更好的办法:

{{ if not .Site.IsServer }}
{{ template "_internal/google_analytics_async.html" . }}
{{ end }}

这样就可以直接判断是否为Server模式了。

Search Console

在设置完Google Analytics后,会收到信息, 建议关联Google Analytics(分析)和Search Console。

前者是做数据采集与统计,而后者是做Google搜索的相关定制。

添加网站并验证

verification页面,添加网站并验证。

使用【备用方法】【Google Analytics】来验证,可以一举两得。

提交站点地图

默认情况下,Hugo已经自动在网站根目录,生成了sitemap.xml文件。

所以,只需要在【抓取】【站点地图】页面,指定提交即可。

总结

值得一提的是,Google在孤完成上述操作后,就可以在搜索中显示结果了。

而百度,过了很久,仍然不行。 参见另一篇笔记《百度链接提交与统计》。

参考


相关笔记