Googleアナリティクス(GA4)のアカウントを作成し、いざタグを取得したものの、「このコード、一体どこに貼ればいいの?」と迷ってしまうことはありませんか?

大切なサイトのデータを正確に計測するためには、GAタグを正しい場所に設置することが非常に重要です。設置場所を間違えてしまうと、データがうまく取れなかったり、数値がズレてしまったりする原因にもなりかねません。

実は、GAタグの設置場所には「基本の正解」がありますが、サイトの作り(WordPressなのか、手書きのHTMLなのかなど)によって最適な手順が少しずつ異なります。

この記事では、初心者の方でも迷わず設置できるように、GAタグの正しい設置場所と3つの具体的な設置方法を、やさしく丁寧に解説します。あなたにぴったりの方法を見つけて、正しいアクセス解析をスタートさせましょう。

GAタグ(Googleタグ)の正しい設置場所とは

GAタグ(Googleタグ)の正しい設置場所とは

まずは、Googleアナリティクスで計測を行うための「Googleタグ(GAタグ)」を、HTMLコードのどこに配置すべきかという基本ルールを押さえておきましょう。ここを理解しておくと、後々のトラブルを防ぐことができます。

基本ルールはHTMLのタグ内のなるべく上部

結論からお伝えすると、GAタグの設置場所はHTMLの<head>タグの中、それもできるだけ上部が推奨されています。

なぜ「なるべく上」が良いのでしょうか。それは、Webページが読み込まれ始めた瞬間に、すぐにタグを反応させるためです。

WebブラウザはHTMLコードを上から順番に読み込んでいきます。もしタグが下のほうにあると、ページのデザインが表示されるまで計測が始まらず、読み込み途中で閉じてしまったユーザーを「訪問者」としてカウントできない可能性があるのです。正確なデータを取るためにも、<head>の開始直後に貼り付けるのが理想的ですね。

タグ内への設置が推奨されない理由

「画面に表示される内容を書く<body>タグの中に貼ってはダメなの?」と疑問に思う方もいるかもしれません。

絶対に動かないわけではありませんが、Google公式としても<body>タグ内への設置は推奨されていません

<body>タグ内、特にページの下の方に設置してしまうと、画像や文章などのコンテンツがすべて読み込まれた後にやっと計測タグが動くことになります。これでは、ページの表示速度が遅い場合や、ユーザーがすぐに別のページへ移動してしまった場合に、計測漏れが発生しやすくなるのです。せっかくのアクセスを取りこぼさないよう、基本通り<head>内に設置しましょう。

設置場所を間違えるとデータが正しく計測されないリスク

Google アナリティクスのヘルプなどでも案内されているように、gaタグ 設置場所を間違えることには、単なる設定ミスというだけでなく、データ計測におけるリスクが伴います。公式ドキュメントに基づき、正しい位置(<head>要素内のなるべく上部)に設置しないと、以下のような影響が出る可能性があるんです。

  • アクセス数の計測漏れ: ページが完全に表示される前にユーザーが離脱した場合、実際の訪問者数よりも少なくカウントされてしまうことがあります
  • 行動データの精度低下: ユーザーの動きを正しく追いきれず、直帰率などの分析精度が下がってしまうかもしれません
  • 広告成果の測定ミス: コンバージョン(成果)が正しく計測できず、広告運用の改善が難しくなることも考えられます

「なんとなく動いているから大丈夫」と思わずに、最初から推奨されている正しい位置に設置しておくことが、Webサイト運営の成功への第一歩ですね。正しいデータを積み上げていくためにも、ぜひ設置場所を見直してみてください。

サイト環境に合わせた3種類の設置方法

サイト環境に合わせた3種類の設置方法

GAタグを<head>内に設置するという基本は同じですが、実際にどうやってコードを埋め込むかは、運営しているサイトの環境によって大きく3つのパターンに分かれます。ご自身のサイト環境に合わせて、最適な方法を選んでみてください。

設置方法向いているサイト環境特徴
1. HTML直接記述静的サイト、手作りサイトシンプルだが全ページ編集が必要
2. CMS機能利用WordPressなどのブログ管理画面から簡単に設定可能
3. GTM利用すべてのサイト(推奨)タグを一元管理でき、拡張性が高い

HTMLファイルへ直接コードを記述する(静的サイトなど)

昔ながらのホームページのように、HTMLファイルを一つひとつ作っている「静的サイト」の場合は、HTMLファイルそのものを編集してコードを貼り付けます。

この方法は仕組みがシンプルで分かりやすいのがメリットですが、ページ数が何十、何百とある場合、すべてのファイルにコードを貼り付ける作業が必要になり、管理が大変になることもあります。ヘッダー部分を共通のファイルで管理している場合は、そのファイルを編集するだけで済むでしょう。

WordPressなどのCMS機能を利用して設置する

WordPress(ワードプレス)やWix、ShopifyなどのCMS(コンテンツ管理システム)を使っている場合は、もっと簡単に設置できる機能が用意されていることが多いです。

HTMLコードを直接触らなくても、管理画面にある「設定」や「プラグイン」の入力欄に、Googleアナリティクスの「測定ID(G-から始まるコード)」をコピペするだけで完了します。初心者の方には、この方法が一番ミスが少なく、手軽でおすすめですね。

Googleタグマネージャー(GTM)経由で配信する

Webマーケティングのプロもよく使っているのが、「Googleタグマネージャー(GTM)」を使った設置方法です。

これは、サイト上に「GTMのコード」を一度だけ埋め込んでおけば、あとはGTMの管理画面上でGAタグや広告タグなどを自由に管理できるという便利なツールです。最初は設定の手順が少し多いですが、将来的に広告配信や複雑な計測を行いたいと考えているなら、今のうちにGTM経由にしておくと後々とても楽になりますよ。

【方法1】HTMLに直接記述して設置する手順

【方法1】HTMLに直接記述して設置する手順

それでは、具体的な手順を見ていきましょう。まずは、HTMLファイルに直接コードを書き込む方法です。企業のコーポレートサイトや、ご自身でHTMLを書いている方はこちらの手順を参考にしてください。

Googleアナリティクス管理画面で実装コードをコピーする

最初に、gaタグ 設置場所に埋め込むための「Googleタグ(gtag.js)」を取得しましょう。現在はGoogleアナリティクス4(GA4)が標準ですので、その手順をご紹介しますね。

  1. Googleアナリティクスにログインしたら、左下の歯車マーク「管理」をクリックしてください
  2. 「データの収集と修正」メニューから「データストリーム」を選択します
  3. 一覧から、該当するウェブストリームをクリックしましょう
  4. 「Googleタグを構成する」または「実装手順を表示」をクリックし、「手動でインストールする」タブを開いてみてください

ここに表示された、<script>から始まり</script>で終わる長いコードが、あなたのサイト専用のGA4タグです。右上のコピーボタンを押して、クリップボードにコピーしておきましょう。

全ページの開始タグの直後にペーストする

次に、サイトのHTMLファイルを開きます。

ファイルの上の方にある<head>というタグを探してください。見つかったら、そのすぐ下(開始タグの直後)に改行を入れ、先ほどコピーしたコードを貼り付けます。

<head>
  <!-- Google tag (gtag.js) -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXX"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'G-XXXXXX');
  </script>
  <!-- End Google tag -->
  <meta charset="UTF-8">
  <title>ページのタイトル</title>
  ...Code language: HTML, XML (xml)

このように、他のメタタグやタイトルタグよりも上に置くのがベストです。これを計測したいすべてのHTMLファイルに行います。

共通パーツ(ヘッダーファイル)がある場合の記述箇所

「全ページに貼るのは大変すぎる!」という場合、多くのサイトではヘッダー部分を「header.html」や「header.php」などの共通ファイルとして管理しているはずです。

その場合は、その共通ヘッダーファイルに一度だけタグを貼り付ければ、サイト内の全ページに反映されます。これなら作業も一回で済みますし、貼り忘れのリスクも減らせますね。お使いのサイトの構造を確認し、効率よく作業を進めてみてください。

【方法2】WordPress(ワードプレス)で設置する手順

【方法2】WordPress(ワードプレス)で設置する手順

多くのブログやWebサイトで使用されているWordPress。この場合、HTMLを直接編集するよりも、テーマの機能やプラグインを使うほうが安全で簡単です。いくつかのパターンを紹介します。

使用しているテーマの設定項目に測定IDを入力する

最近の優秀なWordPressテーマ(Cocoon、SWELL、Lightningなど)には、最初からGoogleアナリティクスの設定項目が用意されています。

  1. WordPress管理画面から「外観」→「カスタマイズ」またはテーマ独自の設定メニューを開く
  2. 「アクセス解析」や「SEO設定」といった項目を探す
  3. 「Googleアナリティクス測定ID」という欄に、「G-」から始まるIDを入力する

これだけで設定完了です。長いコードを貼る必要すらなく、IDを入れるだけなので非常に簡単ですね。まずはお使いのテーマにこの機能がないか確認してみましょう。

SEOプラグインなどの「ヘッダー挿入機能」を利用する

テーマに設定機能がない場合は、プラグインを使うのが便利です。「All in One SEO」や「Yoast SEO」などの有名プラグインには、タグを挿入する機能がついています。

または、「Insert Headers and Footers」のような、ヘッダーにコードを追加するためだけのシンプルなプラグインを使うのも良いでしょう。

  1. プラグインの設定画面を開く
  2. 「Header」や「Head」と書かれた入力欄を見つける
  3. GAタグのコード全体(<script></script>)を貼り付けて保存

これで、自動的に全ページの<head>内にタグが出力されます。

テーマエディタで「header.php」を編集して貼り付ける

プラグインを増やしたくない場合は、テーマの「header.php」というファイルを直接編集する方法もありますが、これは少し上級者向けです。

「外観」→「テーマファイルエディター」から「header.php」を開き、<head>タグの直後にコードを貼り付けます。

ただし、親テーマを直接編集すると、テーマのアップデート時に記述が消えてしまうというデメリットがあります。この方法をとる場合は、必ず「子テーマ」を作成して編集するか、アップデートのたびに再設定が必要になることを覚えておいてください。初心者の方には、前述のテーマ機能かプラグインの利用を強くおすすめします。

【方法3】Googleタグマネージャー(GTM)で設置する手順

【方法3】Googleタグマネージャー(GTM)で設置する手順

最後に、最も拡張性が高くプロも推奨する「Googleタグマネージャー(GTM)」を使った設置手順です。一度導入してしまえば、GA4以外のタグ管理も楽になりますよ。

GTMアカウントを作成しコンテナコードを発行する

まずはGTMのアカウントを作りましょう。Googleタグマネージャーの公式サイトにアクセスし、Googleアカウントでログインして「アカウントを作成」をクリックします。

国やコンテナ名(サイトのURLなど)を入力し、ターゲットプラットフォームで「ウェブ」を選択して作成ボタンを押します。

すると、利用規約の同意後に「Googleタグマネージャーをインストール」という画面が表示され、2つのコードが出てきます。これがGTMを動かすための「コンテナコード」です。

GTMのコードをサイトの内と直後に設置する

発行された2つのコードを、それぞれ指定された場所に貼り付けます。

  1. 上のコード: <head>内のなるべく上の方に貼り付け
  2. 下のコード: <body>タグの開始直後に貼り付け

WordPressの場合は、GTM用のプラグイン(GTM4WPなど)を使うか、テーマ設定の「GTM ID」入力欄にID(GTM-XXXXXX)を入れるだけで済むこともあります。HTMLサイトの場合は、全ページの該当箇所にこの2つのコードを埋め込んでください。

GTM管理画面で「Googleタグ」を設定し公開する

サイトにGTMの箱(コンテナ)を設置したら、その箱の中にGA4のタグを入れます。

  1. GTMの管理画面で「タグ」→「新規」をクリック
  2. タグの設定で「Googleアナリティクス」→「Googleタグ」を選択
  3. 「タグID」の欄に、GA4の測定ID(G-XXXXXX)を入力
  4. トリガーで「Initialization – All Pages(初期化 – 全ページ)」を選択
  5. 名前をつけて保存し、画面右上の「公開」ボタンを押す

これで、GTM経由でGA4タグが配信されるようになります。「公開」ボタンを押し忘れると計測が始まらないので注意してくださいね。

既存のGAタグを削除して重複計測を防ぐ

ここで一つ、非常に重要な注意点があります。

もし、これまで「方法1」や「方法2」で既にGAタグを設置していた場合、GTMを導入するタイミングで古いGAタグは必ず削除してください

削除せずにGTMでも配信してしまうと、タグが2重に動くことになり、アクセス数が2倍にカウントされるなどの不具合が起きてしまいます。「GTMに切り替えるときは、古いタグをお掃除する」と覚えておきましょう。

設置後に正しく計測できているか確認する方法

設置後に正しく計測できているか確認する方法

GAタグの設置作業、本当にお疲れ様でした!でも、正しい設置場所にコードを貼っただけでは終わりではありません。本当に正しくデータが計測できているか、確認するところまでがセットです。

ここでは、初心者の方でも簡単にできる確認方法を3つご紹介しますね。

  1. リアルタイムレポートを見る
    ご自身のサイトにアクセスした状態で、Google Analyticsの「リアルタイム」画面を開いてみましょう。現在の利用者が「1」以上になっていれば、無事に計測できています。
  2. ソースコードを確認する
    サイト上で右クリックして「ページのソースを表示」を選んでみてください。GAタグが推奨される設置場所(headタグ内など)にきちんと入っているか、目視でチェックしましょう。
  3. 拡張機能を使う
    Google Chromeの拡張機能「Tag Assistant」などを利用すると、タグが正常に動いているか自動で診断してくれます。

焦らずひとつずつ、確認してみてくださいね。

GA4の「リアルタイム」レポートで自分のアクセスを見る

一番手っ取り早くて確実なのが、GA4の「リアルタイム」レポートを使う方法です。

  1. PCやスマホで、自分のWebサイトを開く
  2. 別のタブでGoogleアナリティクスを開き、左メニューの「レポート」→「リアルタイム」をクリック

もしタグが正しく動いていれば、数秒〜数十秒以内に「過去30分間のユーザー」という数字が「1」以上になり、地図上にあなたの現在地が表示されるはずです。これで反応があれば、ひとまず設置は成功しています。

ブラウザの「ページのソースを表示」でタグの有無を確認する

念のため、コードが正しい場所に貼られているかも目視で確認しておきましょう。

ブラウザで自分のサイトを開き、画面上の何もないところで右クリックして「ページのソースを表示」を選択します。

表示された英数字の羅列の中から、「G-」(測定ID)や「GTM-」(タグマネージャーID)を検索(WindowsならCtrl+F、MacならCommand+F)してみてください。<head>タグの中にちゃんと見つかればOKです。

拡張機能「Tag Assistant Companion」で動作チェックする

GAタグの設置場所が正しいかどうか、もう少し専門的にチェックしたいときは、Google公式のChrome拡張機能「Tag Assistant」がとても便利です。「Tag Assistant Companion」は「Tag Assistant」に統合されて自動的にアンインストールされる予定ですので、これからは「Tag Assistant」を使うようにしましょう。

これをブラウザにインストールしてサイトを見てみると、タグがきちんと動いているか診断してくれます。緑や青は正常、赤はエラーなど、色でタグの状態をわかりやすく教えてくれるので、設定に不安がある方はぜひ試してみてくださいね。

GAタグ設置で失敗しないための注意点

GAタグ設置で失敗しないための注意点

最後に、GAタグ設置において初心者が陥りやすいミスと、運用を始めてから困らないための注意点をまとめました。転ばぬ先の杖としてチェックしておきましょう。

すべてのページにタグが埋め込まれているか確認する

トップページには設置したけれど、下層ページ(記事ページやお問い合わせページなど)への設置を忘れていた、というケースが意外とあります。

特に、HTMLを直接編集する「静的サイト」の場合や、ランディングページ(LP)だけ別のファイルで作っている場合などに起こりがちです。計測できていないページがあると、ユーザーがどこで離脱したのかが分からなくなってしまいます。主要なページをいくつか開いて、ソース確認を行っておくと安心ですね。

2重にタグを設置して直帰率がおかしくなるのを防ぐ

先ほども少し触れましたが、タグの「2重設置」には本当に気をつけてください。

よくあるのが、「WordPressのテーマ設定でIDを入れたのに、プラグインでも設定してしまった」とか、「HTMLに直接書いたまま、GTMでも配信してしまった」というパターンです。

これをしてしまうと、直帰率が極端に低くなったり(数%などあり得ない数字になる)、PV数が実態の倍になったりと、データが使い物にならなくなってしまいます。設置方法は必ずどれか1つに絞りましょう。

関係者のアクセスを除外する内部トラフィック設定を行う

適切なGAタグの設置場所にコードを貼り付けると、あなた自身のアクセスも「1ユーザー」としてカウントされ始めます。しかし、サイト運営者は頻繁に自分のサイトを確認するため、そのままでは正確なデータ分析の邪魔になってしまいます。

そこで、関係者のアクセスを除外する設定を行いましょう。まずGA4の管理画面で「内部トラフィックの定義」を行い、自宅や会社のIPアドレスを登録します。ただし、これだけでは除外されないので注意が必要です。そのあとに「データフィルタ」の設定を有効化することで、初めて除外が適用されます。

正確なデータを集めるためには、この2つの手順でしっかりと自分たちのアクセスを取り除くことが大切でしょう。

まとめ

まとめ 8

GAタグ(Googleタグ)の正しい設置場所は、HTMLの<head>内の最後(</head>の直前)です。タグには読み込みを待たずに処理を進める「async(非同期)」という機能がついているため、この場所に置くことでページの表示速度を保ちつつ、正確なデータを計測できるでしょう。

設置方法には主に以下の3つがありました。

  1. HTML直接記述: シンプルですが、管理の手間がかかります
  2. CMS機能: WordPressなら設定やプラグインで簡単です
  3. GTM利用: 管理が便利で拡張性が高いのでおすすめです

ご自身のサイト環境やスキルに合わせて、無理のない方法を選んでみてください。特にGTMを使う場合は、HTMLへの直接記述と重複してしまうとデータが二重になってしまうので注意しましょう。正しく設置ができたら、リアルタイムレポートで動作を確認し、自分自身のアクセスを除外する設定まで行えば完璧です。

正確なデータは、サイトを成長させるための宝の地図になります。まずは正しい設置からスタートして、Webサイト運営を楽しんでいきましょう!

gaタグ 設置場所についてよくある質問

gaタグ 設置場所についてよくある質問

読者の方からよくいただく、GAタグの設置に関する質問をまとめました。

  • Q. 設置場所はheadタグの最後の方でも大丈夫ですか?
    • A. 動作はしますが、推奨は「なるべく上」です。下の方にあると、読み込みが完了する前にユーザーがページを閉じた場合、計測できない可能性があります。
  • Q. bodyタグの最後に設置してはいけませんか?
    • A. 推奨されません。ページの表示が終わってから読み込まれるため、計測漏れのリスクが高まります。特別な理由がない限り<head>内に設置しましょう。
  • Q. 古いユニバーサルアナリティクス(UA)のタグはどうすればいいですか?
    • A. UAは既に計測を終了しています。ページの読み込み速度を少しでも速くするために、古いタグは削除することをおすすめします。
  • Q. 1つのページに複数のGA4タグを入れてもいいですか?
    • A. 基本的には1つのプロパティにつき1つのタグのみ設置します。複数のタグを入れると管理が複雑になり、ページの表示速度にも影響するため、必要最小限にしましょう。
  • Q. タグを設置したのにレポートに反映されません。
    • A. 設置直後はデータが反映されるまで最大24〜48時間かかることがあります。「リアルタイム」レポートで反応があれば設置は成功しているので、翌日まで待ってみてください。