GA4を導入したい（基本）

このページでは、ホームページに Googleアナリティクス4（GA4） を導入するための 基本的な流れ をまとめています。

「とりあえずアクセス数やページビューを把握したい」という方向けに、アカウント作成 → 測定IDの取得 → HTMLへのタグ設置 までをシンプルに解説します。

このページの対象とゴール
GA4導入の全体像：何をどこで設定する？
事前に準備しておくもの
STEP1：GA4のアカウント・プロパティを作成する
STEP2：Webデータストリームを作成して測定IDを取得する
STEP3：計測タグ（gtag.js）をHTMLの<head>に貼り付ける
1. 3-1. 貼り付ける位置のイメージ
2. ポイント：共通パーツに入れると管理しやすい
STEP4：リアルタイムレポートで計測確認をする
よくあるつまづきとチェックポイント
次のステップ：GA4でできることを少しずつ広げる

このページの対象とゴール

このページは、次のような方を想定しています。

これから初めて GA4 を導入しようとしている
静的HTMLテンプレート（Temply Restaurant など） にタグを埋め込みたい
まずは「アクセス数・よく見られているページ・デバイス（PC/スマホ）」くらいを把握できればOK

読み終わるころには、次の状態を目指します。

GA4 のアカウント・プロパティ（Webデータストリーム）が作成できている
ホームページの <head> 内に GA4タグ（gtag.js）が設置されている
リアルタイムレポートで「自分のアクセスがカウントされている」ことを確認できている

ポイント：最初は「入れておく」だけでも十分

GA4は機能が多くて難しく見えますが、とりあえずタグだけ入れてデータを貯めておくだけでも価値があります。細かいイベント計測などは、あとから少しずつ追加していきましょう。

GA4導入の全体像：何をどこで設定する？

GA4をサイトに導入する大まかな流れは、次のようになります。

Googleアカウントで Googleアナリティクスのアカウント・プロパティ を作成する
Webデータストリーム を作成し、測定ID（例：G-XXXXXXX）を取得する
発行された タグ（gtag.js） を、サイトの <head> 内に貼り付ける
公開後、自分のアクセスがリアルタイムレポートに反映されるか確認する

ポイント：タグマネージャーなしでOK

Templyのような静的HTMLサイトの場合、Googleタグマネージャーを使わずに、直接HTMLにタグを貼る方法がシンプルです。慣れてきたらタグマネージャーを検討しても問題ありません。

事前に準備しておくもの

Googleアカウント（GmailでもOK）
公開予定（または公開済み）の サイトURL
HTMLファイル（または共通ヘッダー）の <head> を編集できる環境
例：index.html や head.html など

ポイント：あとからURLを変更しても大丈夫

GA4の「ウェブサイトURL」は、あとから修正することもできます。独自ドメインの準備と同時進行の場合は、まずは現時点のURLを入れておき、後で整える形でも問題ありません。

STEP1：GA4のアカウント・プロパティを作成する

まずは Googleアナリティクスの管理画面で、アカウントとプロパティ（サイト単位の設定）を作成します。

Googleアナリティクスにアクセスし、Googleアカウントでログインする
初めて利用する場合は「測定を開始」をクリックし、アカウント名を入力する
続いて、プロパティ名（例：店舗サイト名 など）とタイムゾーン・通貨を設定する
ビジネス情報のアンケートは、必要に応じて入力またはスキップする

ポイント：アカウント名・プロパティ名は後から変更OK

名前は管理しやすければOKです。「屋号名-本番サイト」「屋号名-テスト」など、あとで見たときに区別しやすい名前にしておくと便利です。

STEP2：Webデータストリームを作成して測定IDを取得する

プロパティが作成できたら、サイト用の Webデータストリーム を作成します。

プロパティを選択した状態で、「データストリーム」→「ウェブ」を選ぶ
ウェブサイトのURL（https://example.com など）とストリーム名（例：本番サイト）を入力する
「ストリームを作成」をクリックする
表示された画面で、測定ID（例：G-XXXXXXXXXX） を確認する
同じ画面内にある「タグの実装手順」から、グローバルサイトタグ（gtag.js） のコードをコピーする

ポイント：測定IDだけメモしておくと便利

gtag.js のコードは後で貼り付けますが、測定ID（G-から始まる文字列）だけメモしておくと、コード内で確認しやすくなります。

STEP3：計測タグ（gtag.js）をHTMLの<head>に貼り付ける

次に、コピーした GA4タグをサイトの HTML に貼り付けます。

3-1. 貼り付ける位置のイメージ

</head> タグの直前あたりに、次のようなコードを入れます（例）：

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>サイトタイトル</title>
  <!-- ここに他のmetaやCSS読み込み -->

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

G-XXXXXXXXXX の部分は、実際の測定IDに置き換えてください。