Google Analyticsのスクリプトがanalytics.jsからgtag.jsに変えた方が良さそうということで、変えてみた。
Hugo(v0.80.0)および使用しているテンプレートでgtag.jsに対応していないので、Hugoの機能を使ってテンプレートの一部をオーバーライドすることでリプレイスすることにした。
Hugoのテンプレートのオーバーライドの仕組みはシンプルで、どうやら以下の優先順位の様子。テンプレートのファイルを書き換えたい場合は同名のファイルをテンプレート外の/layouts/以下においておくだけ。
※部分テンプレートscripts.htmlの例。
/layouts/partials/scripts.html/themes/テーマ名/layouts/partials/scripts.html
初期状態では/layouts/partials/scripts.htmlは存在しないので、/themes/テーマ名/layouts/partials/scripts.htmlを修正元としてコピー&リネームして配置する。
その後、
{{- template "_internal/google_analytics_async.html" . -}}
となっているところを、Googleアナリティクスのコンソールで案内されている以下のコードにリプレイスする。
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id={UA〜ユーザーごとに違うので書き換え必要}"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', '{UA〜ユーザーごとに違うので書き換え必要}');
</script>
これでHugoをデプロイすれば、OK。
本当は_internal/google_analytics_async.htmlを書き換えるなりする方が綺麗な形なのかもしれないけど、このファイルはHugo本体のファイルだからフォークする形になってしまうので面倒。
Hugoのアップデートはされるのかな？と確認したところ、issueは出てるけどまだ取り込まれなさそう。
