Jekyll ChirpyでCloudflare Web Analyticsを使用する

Cloudflare Web Analyticsの設定

Cloudflare Web AnalyticsはChirpy v7.0.0以降で対応されていて¹、IDを設定するだけで有効化できる。

まず、Cloudflare Web Analyticsを有効化したときに発行されるJavaScript Snippetからトークンを取り出す。

<!-- Cloudflare Web Analytics -->
<script defer src='https://static.cloudflareinsights.com/beacon.min.js'
 data-cf-beacon='{"token": "token***************************"}'>
</script>
<!-- End Cloudflare Web Analytics -->

取り出したトークンを _config.yaml で設定する。

_config:

# Web Analytics Settings
analytics:
  cloudflare:
    id: token***************************

production環境でのみ有効になっているので、ビルド結果を見たい場合は環境の指定が必要。

JEKYLL_ENV=production bundle exec jekyll build

ソース

Cloudflare Web Analyticsを設定するソースは以下になる。発行されるJavaScript Snippetがそのまま記述されており、トークン部分が変数になっている。

• _includes/analytics/cloudflare.html

上記のanalyticsファイルは以下の部分で読み込まれている。production環境でのみ読み込まれることが確認できる。

• _includes/head.html

1. https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/docs/CHANGELOG.md#700-2024-05-11 ↩︎