自宅サーバーをClaude Codeで引っ越し その6：Google Analyticsの導入
前回は、1999年製の電子掲示板を新しいサーバーで復活させてもらった話でした。今回は、ホームページにGoogle Analyticsを導入した話です。
カウンターだけでは分からないこと
その4で復活させたアクセスカウンターで、訪問者の数は分かります。ただ、どのページがよく見られているのか、どこから来てくれているのか、といったことまでは分かりません。
折角サーバーを新しくしたので、Google Analyticsで詳しいアクセス状況も見られるようにしたいとClaude Codeに相談しました。Takesa’s Homepage と krp の両サイトについて、それぞれGoogle Analyticsのプロパティを作って、測定IDを用意しています。
4,000以上のページにタグを入れる？
Google Analyticsを使うには、計測用のタグ（数行のJavaScript）を、すべてのページのHTMLの <head> の中に入れる必要があります。
ところが、Takesa’s Homepage だけでも、HTMLのページが4,000ファイル以上あります。しかも、サイトを作ったBiND 5はもう起動できないので、ソフト側でまとめてタグを入れ直すこともできません。その3のようにスクリプトで全ファイルを書き換える方法も考えられますが、できれば元のファイルには手を入れたくないところです。
nginxに入れてもらう
Claude Codeが提案してくれたのは、ファイルは一切書き換えずに、nginxがページを返すときにタグを差し込む、という方法でした。nginxの sub_filter という機能を使うと、送り出すHTMLの中の文字列を置き換えることができます。これで </head> の直前に計測用のタグを入れてもらいます。
server {
listen 8080;
server_name takesa.dyndns.org;
root /var/www/html;
sub_filter '</head>' '<!-- Google tag (gtag.js) -->…計測用のタグ…</head>';
}サイトごとの設定（serverブロック）に、それぞれのサイトの測定IDを入れたタグを書いておけば、どのページにアクセスしても自動でタグが入った状態で表示されます。元のHTMLファイルはそのままなので、後から計測をやめたくなったときも、この設定を消すだけで済みます。
実際にページを開いてソースを確認すると、ちゃんと </head> の手前にタグが入っていて、Google Analyticsの画面にもアクセスが記録されるようになりました。
カウンターとの役割分担
Google Analyticsのデータを使って、訪問者数をカウンターとして表示する方法も検討しました。ただ、アクセスカウンターはすでにnpcで復活していたので、そこまでは不要と判断しています。
- 訪問者に見せるカウンター表示 → これまでどおり npc
- 自分で見る詳しいアクセス分析 → Google Analytics
という役割分担です。
振り返り
「全ページにタグを入れたい」と相談して、ファイルを書き換える方法ではなく、Webサーバー側で差し込む方法があるということで、4,000以上のHTMLファイルに一切触れずに済みました。
これで、既存のホームページの移行作業はひと段落です。
次回
次回は、いよいよ新しくWordPressを導入した話です。このブログの始まりでもあります。
