Joomla! 初心者ガイド
JoomlaにGoogleアナリティクスを
導入する方法
拡張機能不要・テンプレート直接編集で完結
Webサイトの改善には、アクセス解析が欠かせません。この記事では、拡張機能(エクステンション)を一切使わずに、Joomlaのテンプレートファイルを直接編集してGoogleアナリティクス(GA4)を導入する方法を解説します。コアのアップデートによる互換性リスクを最小化したい方に最適な方法です。
この記事でわかること
| 項目 | 内容 |
|---|---|
| 対象バージョン | Joomla! 4.x / 5.x / 6.x |
| 編集するファイル | /templates/cassiopeia/index.php |
| 拡張機能 | 不要(手動設置) |
| 難易度 | ★☆☆ 初心者でも対応可能 |
作業の全体像
作業は大きく5つのステップで完了します。所要時間は慣れていれば10分程度です。
STEP 1:Googleアナリティクスのトラッキングコードをコピーする
まず、Googleアナリティクス(analytics.google.com)にログインし、以下の手順でトラッキングコードを取得します。
- 左下の「管理(歯車アイコン)」をクリック
- 「プロパティ」列の「データストリーム」を選択
- 対象のウェブサイトストリームをクリック
- 「タグの実装手順を表示する」をクリック
- 「手動でインストールする」タブを選択
- 表示されたJavaScriptコードをすべてコピー
▲ 「手動でインストールする」タブに表示されるコードをすべてコピーします
コードはどこに貼り付けるの?
GA4の画面には「<head> 要素の直後に貼り付けます」と案内されています。Joomlaでは、この <head> タグが書かれているファイルを探して編集する必要があります。次のステップで詳しく説明します。
STEP 2:なぜ cassiopeia の index.php を編集するのか
ここで少し重要な仕組みを理解しておきましょう。
子テンプレート(cassiopeia_extended)に <head> がない理由
cassiopeia_extended は、Cassiopeiaをベースにした子テンプレート(カスタムテンプレート)です。子テンプレートは、親テンプレートのファイルを「継承」して動作します。
子テンプレートの index.php に <head> タグがないのは、親テンプレート(cassiopeia)の index.php が <head> を担当しているからです。子テンプレート側でオーバーライドしていない限り、親のファイルがそのまま使われます。
したがって、Googleアナリティクスのコードを設置するには、/templates/cassiopeia/index.php を編集する必要があります。
| ファイル | <head> の有無 | 編集すべきか |
|---|---|---|
| /templates/cassiopeia/index.php | あり (親テンプレート) |
◎ ここに貼り付ける |
| /templates/cassiopeia_extended/index.php | なし (子テンプレート) |
× 編集しても反映されない |
コアアップデートへの対応について
/templates/cassiopeia/index.php はJoomlaのコアファイルです。Joomlaのアップデート時に上書きされる可能性があります。アップデート後はGoogleアナリティクスが動作しているか必ず確認し、上書きされていた場合は再度コードを貼り付けてください。アップデート前に編集内容をメモしておくと安心です。
STEP 3:Joomlaのテンプレートエディタで index.php を開く
Joomlaの管理画面からテンプレートファイルを編集します。
- Joomla管理画面にログイン
- 左サイドメニューの「システム」をクリック
- 「テンプレート」セクションの「サイトテンプレート」を選択
- 「Cassiopeia」の「詳細とファイル」をクリック
- 左側のファイル一覧から
index.phpを選択
STEP 4:<head> タグの直後にコードを貼り付ける
Ctrl + F(Macは Cmd + F)で <head> を検索します。行番号129付近に <head> タグが見つかります。
<head> タグの直後の行(130行目)に、STEP 1でコピーしたGoogleアナリティクスのコードを貼り付けます。
▲ <head> タグ(129行目)の直後にGoogleアナリティクスのコードを貼り付けます
貼り付け後のイメージ(index.php 129〜142行目付近)
129: <head>
130: <!-- Google tag (gtag.js) -->
131: <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
132: <script>
133: window.dataLayer = window.dataLayer || [];
134: function gtag(){dataLayer.push(arguments);}
135: gtag('js', new Date());
136:
137: gtag('config', 'G-XXXXXXXXXX');
138: </script>
139: <jdoc:include type="metas" />
140: <jdoc:include type="styles" />
141: <jdoc:include type="scripts" />
142: </head>
編集前にバックアップを忘れずに
テンプレートファイルを直接編集する前に、必ず index.php の内容をローカルにコピー&保存しておきましょう。誤って保存してしまった場合でも、バックアップがあれば即座に復元できます。
STEP 5:保存して動作確認する
コードを貼り付けたら、エディタ上部の「保存して閉じる」ボタンをクリックします。その後、以下の手順で正しく動作しているかを確認します。
- Joomlaサイトのトップページにアクセスする(ブラウザのシークレットモード推奨)
- Googleアナリティクスの管理画面を開く
- 左メニューの「レポート」→「リアルタイム」を選択
- 「過去30分間のユーザー」に数字が表示されれば設定完了
データが表示されるまで数分かかる場合があります。すぐに反映されない場合は、少し時間をおいてから再確認してください。また、ブラウザの広告ブロック拡張機能がGoogleアナリティクスをブロックしている場合もあるため、シークレットモードでの確認を推奨します。
コアアップデート時の注意点まとめ
今回編集した /templates/cassiopeia/index.php はJoomlaのコアファイルです。アップデート時の上書きリスクを理解した上で運用しましょう。
| タイミング | 確認事項 |
|---|---|
| マイナーアップデート後 (例:5.3 → 5.4) |
リアルタイムレポートでアナリティクスの動作を確認。上書きされていたら再貼り付け。 |
| メジャーアップデート後 (例:5.x → 6.x) |
テンプレート構造が変わる可能性あり。<head> タグの位置を再確認してから貼り付け。 |
どうしても手動が難しい場合の代替手段
テンプレートの直接編集に不安がある場合は、Joomla Extension Directory(JED)に登録されている拡張機能を利用する方法もあります。
代替として利用できる拡張機能
JEDで「Google Analytics」と検索すると複数の拡張機能が見つかります。管理画面から測定IDを入力するだけで設定が完了するため、テンプレート編集が不要です。ただし、拡張機能の更新がJoomlaコアのアップデートに追いつかない場合があるため、定期的な互換性確認が必要です。
JEDでGoogleアナリティクス拡張機能を探す →まとめ
この記事では、Joomla! 4.x / 5.x / 6.x 共通の手順として、/templates/cassiopeia/index.php を直接編集してGoogleアナリティクス(GA4)を導入する方法を解説しました。
- 拡張機能不要でシンプルかつ軽量
- <head> タグは親テンプレート(cassiopeia)の index.php にある
- アップデート後は動作確認を習慣にする
ぜひこの方法でGoogleアナリティクスを導入し、サイト改善に役立ててください。