ToolShare Lab

アクセス解析 ToolShare Lab / Guide

GA4イベント設定ガイド
カスタムイベント・コンバージョン・GTM連携

「GA4に切り替えたけどイベントの設定方法がわからない」「お問い合わせ送信をコンバージョンとして計測したい」「GTMとGA4のどちらでイベントを設定すべき？」——GA4のイベントモデルはUAのゴール/イベントとは根本的に異なる。この記事では、自動収集・推奨・カスタムイベントの違いから、GTMでの実装、コンバージョン設定、DebugViewでの確認まで、フリーランスのサイト運用で必要な知識を実践的なコード付きで全て解説する。

読了時間: 約15分 更新日: 2026年3月20日

GA4のイベントは自動収集イベント（page_view, scroll等）、推奨イベント（purchase, sign_up等のGoogle定義名）、カスタムイベント（自由に定義）の3種類。お問い合わせ送信やポートフォリオ閲覧など独自の行動を計測するにはカスタムイベントを作成し、コンバージョンとしてマークする。設定はGA4管理画面から直接行う方法とGTM（Googleタグマネージャー）経由の2通りがあり、複雑な条件やパラメータが必要な場合はGTMが推奨される。

GA4イベントとは

GA4（Google Analytics 4）はすべてのユーザー行動をイベントとして記録する。旧UA（Universal Analytics）のように「ページビュー」「イベント」「トランザクション」を別のヒットタイプとして区別せず、全てが統一されたイベントモデルで処理される。

イベントは大きく3種類に分かれる。

種類 設定 特徴 例
自動収集イベント 不要（自動） GA4タグを設置するだけで自動的に収集される page_view, first_visit, session_start
推奨イベント 手動（名前は固定） Googleが定義した名前とパラメータを使う。レポートが自動的に拡張される purchase, sign_up, generate_lead
カスタムイベント 手動（自由定義） 独自の名前・パラメータで完全に自由に設計できる contact_form_submit, portfolio_view

イベントにはパラメータを付与できる。例えば page_view イベントには page_location（URL）や page_title（ページタイトル）が自動的に付与される。カスタムイベントにも任意のパラメータを追加でき、最大25個まで1イベントに付与可能だ。

自動収集イベント一覧

GA4の測定タグを設置するだけで、以下のイベントが自動的に収集される。追加設定は不要だ。

イベント名 トリガー条件 主なパラメータ
page_view ページが読み込まれるたび page_location, page_referrer, page_title
first_visit 初めてサイトを訪問したとき —
session_start 新しいセッション開始時 —
user_engagement ページがフォアグラウンドで1秒以上表示 engagement_time_msec
scroll ページの90%までスクロール percent_scrolled
click 外部リンクをクリック（拡張計測時） link_url, link_domain, outbound
file_download ファイルリンクをクリック（拡張計測時） file_name, file_extension, link_url
view_search_results サイト内検索を実行（拡張計測時） search_term
video_start 埋め込みYouTube動画の再生開始 video_title, video_url, video_percent
video_progress 動画の10%/25%/50%/75%再生時 video_title, video_percent
video_complete 動画の再生完了時 video_title, video_url

Point

scroll、click（外部リンク）、file_download、view_search_results、video_* は拡張計測機能を有効にすると収集される。GA4の管理画面 → データストリーム → 拡張計測機能の設定で個別にON/OFFできる。デフォルトで全てONになっているが、不要なものは無効化して計測ノイズを減らすことも可能だ。

推奨イベントはGoogleが事前に定義した名前・パラメータの組み合わせだ。これらの名前を使うと、GA4のレポートUIが自動的にリッチな表示に拡張される。独自の名前でカスタムイベントを作る前に、推奨イベントで対応できないか必ず確認しよう。

イベント名 用途 主なパラメータ フリーランスでの活用
generate_lead リード獲得（問い合わせ等） currency, value お問い合わせフォーム送信
sign_up ユーザー登録 method メルマガ登録、会員登録
login ログイン method クライアント専用ページ
purchase 購入完了 transaction_id, value, currency, items オンライン決済（ECサイト構築時）
share コンテンツ共有 method, content_type, item_id 実績ページのSNSシェアボタン
select_content コンテンツ選択 content_type, item_id ポートフォリオのフィルター操作
view_item 商品/アイテム表示 items サービス詳細ページの閲覧
search サイト内検索 search_term ブログ・実績のキーワード検索

推奨イベントの完全なリストはGoogleの公式ドキュメントで確認できる。フリーランスのポートフォリオサイトでは generate_lead（問い合わせ）と share（SNS共有）が特に重要だ。

カスタムイベントの作成方法

推奨イベントに該当しない独自の行動を計測したい場合は、カスタムイベントを作成する。GA4の管理画面から作成する方法（コード不要）と、gtag() または GTMで送信する方法がある。

方法1: GA4管理画面から作成（コード不要）

既存のイベントの条件を組み合わせて新しいイベントを作る方法だ。コードの変更が不要なため、エンジニア以外でも設定できる。

設定手順（5ステップ）:

  1. GA4の管理画面を開き、左メニュー「管理」→「イベント」を選択
  2. 「イベントを作成」→「作成」ボタンをクリック
  3. カスタムイベント名を入力（例: scroll_50_percent）
  4. 一致する条件を設定（例: event_name = scroll かつ percent_scrolled = 50）
  5. 「作成」をクリックして保存

Point

この方法は既存イベントの「フィルタリング」に近い。完全に新しい行動（ボタンクリック、フォーム送信など）を計測するには、gtag()かGTMでのイベント送信が必要になる。

方法2: gtag()でコードから送信

HTMLに直接JavaScriptコードを記述してイベントを送信する方法だ。シンプルなサイトやWordPressのテンプレートに埋め込む場合に適している。

// 基本構文 gtag('event', 'イベント名', { パラメータ名: '値', パラメータ名2: '値2' }); // 例: お問い合わせフォーム送信 document.querySelector('#contactForm').addEventListener('submit', function() { gtag('event', 'generate_lead', { event_category: 'contact', event_label: 'contact_form', value: 1 }); }); // 例: ポートフォリオ作品の詳細表示 function trackPortfolioView(workTitle, workCategory) { gtag('event', 'portfolio_detail_view', { work_title: workTitle, work_category: workCategory, page_location: window.location.href }); } // 例: 資料ダウンロード document.querySelector('.js-downloadBtn').addEventListener('click', function() { gtag('event', 'file_download_click', { file_name: 'service-guide.pdf', file_type: 'pdf', download_source: 'service_page' }); });

イベント名の命名規則

カスタムイベント名には以下のルールがある。違反するとデータが収集されないため注意が必要だ。

ルール 詳細 例
文字数 最大40文字 contact_form_submit (20文字)
使用可能文字 英数字とアンダースコアのみ portfolio_view OK / portfolio-view NG
先頭文字 英字で始める（数字NG） event_2026 OK / 2026_event NG
予約語 Googleの予約語は使用不可 ad_click, app_remove など
大文字小文字 区別される（別イベント扱い） Contact_Submit ≠ contact_submit

GTMでのイベント設定

GTM（Googleタグマネージャー）を使えば、コードを直接編集せずにイベントを設定できる。複数の条件を組み合わせたトリガーや、動的な値の取得が必要な場合に特に有効だ。

ステップ1: 変数の設定

GTMの「変数」セクションで、イベントに渡す値を取得するための変数を設定する。

/* GTM 組み込み変数（有効化推奨） */ - Click URL : クリックされたリンクのURL - Click Text : クリックされたテキスト - Click Element : クリックされたDOM要素 - Form Element : 送信されたフォーム要素 - Page Path : 現在のページパス - Page URL : 現在のURL /* ユーザー定義変数の例 */ 変数タイプ: データレイヤーの変数 データレイヤーの変数名: formType → dataLayer.push({ formType: 'contact' }) で送信した値を取得

ステップ2: トリガーの作成

イベントを発火させる条件を「トリガー」として定義する。よく使うトリガータイプは以下の通りだ。

トリガータイプ 用途 設定例
クリック - すべての要素 任意の要素のクリック Click Element が CSS セレクタ .js-ctaBtn に一致
クリック - リンクのみ リンクのクリック Click URL が .pdf を含む
フォーム送信 フォームのsubmit Form Element が #contactForm に一致
スクロール距離 ページの特定位置まで到達 縦スクロール距離が 25%, 50%, 75% に到達
要素の表示 特定要素がビューポートに入った CSS セレクタ #priceSection が表示
カスタムイベント dataLayerへのpush イベント名が form_success に一致

ステップ3: タグの作成

トリガーの条件が満たされたときに実行する「タグ」を作成する。GA4イベントの場合、タグタイプは「Googleアナリティクス: GA4 イベント」を選択する。

/* GTMタグ設定例: お問い合わせ送信 */ タグの種類: Google アナリティクス: GA4 イベント 測定ID: G-XXXXXXXXXX イベント名: generate_lead イベントパラメータ: event_category = contact event_label = contact_form value = 1 トリガー: 「お問い合わせフォーム送信」トリガー /* GTMタグ設定例: CTAボタンクリック */ タグの種類: Google アナリティクス: GA4 イベント 測定ID: G-XXXXXXXXXX イベント名: cta_click イベントパラメータ: button_text = {{Click Text}} page_path = {{Page Path}} click_url = {{Click URL}} トリガー: 「CTAボタンクリック」トリガー

ステップ4: dataLayer.push()との連携

フォーム送信完了後やJavaScriptの処理完了後にイベントを送信したい場合は、dataLayer.push() を使ってGTMにデータを渡す。

// フォーム送信成功時にdataLayerへpush fetch('/api/contact', { method: 'POST', body: formData }) .then(response => { if (response.ok) { window.dataLayer = window.dataLayer || []; window.dataLayer.push({ event: 'form_success', form_type: 'contact', form_destination: 'info@example.com' }); } }); // GTM側のトリガー設定: // タイプ: カスタムイベント // イベント名: form_success

コンバージョン設定

GA4ではイベントを「コンバージョン（キーイベント）」としてマークすることで、ビジネス上重要な行動を優先的にレポートで追跡できる。2024年3月以降、GA4では「コンバージョン」から「キーイベント」に名称変更されたが、機能は同一だ。

コンバージョン登録の手順

  1. GA4管理画面を開き、左メニュー「管理」→「キーイベント」を選択
  2. 「新しいキーイベント」をクリック
  3. コンバージョンとして計測したいイベント名を入力（例: generate_lead）
  4. 「保存」をクリック

Point

イベントが1回以上計測された後でないと、イベント一覧に表示されない。先にDebugViewでイベントが正しく送信されていることを確認してからコンバージョン登録する手順がおすすめだ。

フリーランスサイトで登録すべきコンバージョン

コンバージョン イベント名 重要度 計測理由
お問い合わせ送信 generate_lead 最重要 直接的な売上につながる最重要KPI
電話リンクタップ phone_call_click 重要 モバイルからの直接連絡を計測
資料ダウンロード file_download 重要 サービス資料や料金表の需要を把握
SNSシェア share 中 口コミによる認知拡大の効果測定

デバッグ・確認方法

イベント設定後は、必ずデータが正しく送信されているか確認する。GA4には3つの確認手段がある。

1. DebugView（最も詳細）

GA4管理画面の「管理」→「DebugView」で、リアルタイムにイベントの送信状況を確認できる。デバッグモードを有効にする方法は2つ。

// 方法1: gtag()でデバッグモードを有効化 gtag('config', 'G-XXXXXXXXXX', { debug_mode: true }); // 方法2: Chrome拡張「Google Analytics Debugger」をインストール // → 拡張機能をONにしてサイトを閲覧するだけ // 方法3: GTMのプレビューモード経由（後述）

DebugViewでは、イベントがタイムラインで表示され、各イベントをクリックするとパラメータの値も確認できる。イベント名の誤字や、パラメータの値が正しく渡っているかを検証する最も確実な方法だ。

2. リアルタイムレポート（簡易確認）

GA4のレポート画面の「リアルタイム」セクションで、過去30分以内のイベントを確認できる。DebugViewほど詳細ではないが、イベントが計測されているかどうかの簡易確認に便利だ。

3. GTMプレビューモード（GTM利用時）

GTMの「プレビュー」ボタンをクリックすると、Tag Assistantが起動する。ここでは以下を確認できる。

おすすめの確認フロー

GTMプレビューでタグの発火を確認 → GA4のDebugViewでイベント受信を確認 → リアルタイムレポートで最終チェック、の3段階で確認すると漏れがない。

フリーランスサイトでよく使うイベント設計例

フリーランスのポートフォリオサイトやコーポレートサイトで実際に設計するイベントの具体例を紹介する。そのままコピーして使えるコード付きだ。

例1: お問い合わせフォーム送信

// フォーム送信成功時 document.querySelector('#contactForm').addEventListener('submit', function(e) { // バリデーション通過後に送信 gtag('event', 'generate_lead', { event_category: 'contact', event_label: document.querySelector('#inquiry-type').value, value: 1, currency: 'JPY' }); }); // コンバージョンとして登録: generate_lead → キーイベントに設定

例2: ポートフォリオ作品の閲覧

// 作品詳細を開いたとき function onWorkDetailOpen(work) { gtag('event', 'select_content', { content_type: 'portfolio', item_id: work.id, item_name: work.title, item_category: work.category // 'web_design', 'logo', etc. }); } // 作品一覧のフィルター操作 document.querySelectorAll('.js-portfolioFilter').forEach(function(btn) { btn.addEventListener('click', function() { gtag('event', 'portfolio_filter', { filter_category: this.dataset.category, results_count: document.querySelectorAll('.work-item:not(.hidden)').length }); }); });

例3: 料金ページの閲覧深度

// 料金セクションが画面に入ったとき（Intersection Observer） var observer = new IntersectionObserver(function(entries) { entries.forEach(function(entry) { if (entry.isIntersecting) { gtag('event', 'view_pricing', { section_name: entry.target.dataset.section, page_path: window.location.pathname }); observer.unobserve(entry.target); } }); }, { threshold: 0.5 }); document.querySelectorAll('.pricing-plan').forEach(function(el) { observer.observe(el); });

例4: 電話リンクのタップ（モバイル）

// tel:リンクのクリックを計測 document.querySelectorAll('a[href^="tel:"]').forEach(function(link) { link.addEventListener('click', function() { gtag('event', 'phone_call_click', { phone_number: this.href.replace('tel:', ''), click_location: this.closest('section')?.id || 'unknown' }); }); });

イベント設計のまとめ表

行動 イベント名 種類 コンバージョン
お問い合わせ送信 generate_lead 推奨 必須
電話タップ phone_call_click カスタム 推奨
資料DL file_download 自動（拡張） 推奨
作品閲覧 select_content 推奨 任意
料金ページ閲覧 view_pricing カスタム 任意
SNSシェア share 推奨 任意
フィルター操作 portfolio_filter カスタム 不要
外部リンククリック click 自動（拡張） 不要

ツールで効率化

GA4で収集したデータを元にUTMパラメータ付きURLを効率よく作成したい場合は、当サイトのUTMビルダーを活用しよう。キャンペーンごとのトラフィックをGA4で正確に分析できるようになる。登録不要・完全無料。

GA4と組み合わせて使えるツール

UTMパラメータの作成やJSON-LDの構造化データ検証など、GA4の運用を支援するツールを無料で提供している。登録不要でブラウザだけで使える。

UTMビルダーを開く JSON整形ツール 構造化データ検証

よくある質問

GA4のイベントとUAのイベントは何が違いますか？
UAはカテゴリ・アクション・ラベルの3階層でイベントを定義していたが、GA4はイベント名+パラメータのフラットな構造になった。またUAではページビューとイベントは別のヒットタイプだったが、GA4ではpage_viewも「イベント」として統一的に扱われる。
カスタムイベントは何個まで作れますか？
GA4の無料版では最大500個のカスタムイベント名を使用できる。パラメータは1イベントあたり最大25個。カスタムディメンション/指標として登録できるのはイベントスコープ50個、ユーザースコープ25個が上限だ。
GTMとgtag()のどちらでイベントを設定すべきですか？
フリーランスの小規模サイトなら、まずはgtag()での直接実装で十分だ。ただしイベントの追加・変更のたびにコードを編集する必要がある。複数のクライアントサイトを管理する場合や、マーケティング担当者が設定変更する可能性がある場合はGTMが適している。GTMならコード変更なしで管理画面からイベントを追加・修正できる。
イベントが計測されない場合の確認ポイントは？
よくある原因は5つ。(1) 測定IDの誤り、(2) イベント名の命名規則違反（ハイフン使用や数字始まり）、(3) gtag()の読み込み前にイベントを送信している、(4) 広告ブロッカーによるGA4リクエストのブロック、(5) GTMのコンテナが「公開」されていない。DebugViewとGTMプレビューモードで1つずつ切り分けて確認しよう。
コンバージョン（キーイベント）は何個まで登録できますか？
GA4の無料版では最大30個のキーイベントを登録できる。フリーランスのサイトであれば、お問い合わせ送信・電話タップ・資料DLの3つ程度で十分だ。登録しすぎるとレポートが見にくくなるため、本当にビジネスインパクトのある行動だけに絞ることを推奨する。
イベントのデータはどのくらいで反映されますか？
DebugViewはほぼリアルタイム（数秒〜数十秒）で反映される。リアルタイムレポートは数分のラグがある。標準レポート（レポート → エンゲージメント → イベント）への反映は24〜48時間かかることがある。新しいイベントの初回計測時は特にラグが大きい傾向がある。
GA4のイベントデータはどのくらい保持されますか？
GA4の無料版ではイベントデータの探索レポートでの保持期間は最大14ヶ月だ（管理 → データ設定 → データ保持で変更可能、デフォルトは2ヶ月）。標準レポートのデータは保持期間の制限なく閲覧可能。長期分析が必要な場合はBigQueryへのエクスポート（無料版でも利用可能）を設定しておくことを推奨する。

関連記事・ツール

SEO基礎ガイド

検索エンジン最適化の基本。GA4で計測したデータをSEO改善に活かす方法と合わせて読むと効果的。

OGP設定ガイド

SNSシェア時の表示を最適化。GA4のshareイベントと組み合わせてSNS流入の効果測定に活用できる。

JSON-LD構造化データガイド

構造化データの実装方法。GA4のsearch_appearance分析と合わせてリッチリザルトの効果を測定しよう。

ポートフォリオ作成ガイド

フリーランスのポートフォリオ設計。本記事のイベント設計例をそのまま実装できる。