ウェブサイトの「お問い合わせフォーム」は、ビジネスにおける最重要ポイントのひとつです。中でも、WordPressユーザーに人気の高い「Contact Form 7（CF7）」は、そのシンプルさと柔軟性で多くのサイトに導入されています。
ただし、入力された内容を受け取るだけでは、フォームの「効果」は測れません。ユーザーが実際にフォームを送信したのか、送信率はどれくらいか、どこで離脱しているのか…。これらの情報を把握するためには、Googleタグマネージャー（GTM）を活用した正確な測定設定が不可欠です。
この記事では、GTMとContact Form 7を組み合わせたフォーム送信の測定方法を、専門知識ゼロでも理解できるように徹底解説していきます。
GTMとContact Form 7の相性は抜群！
Contact Form 7は、標準でJavaScriptによるイベントトリガーを発行してくれる、分析しやすいフォームプラグインです。GTMを使えば、このイベントをキャッチしてGA4や他のツールへ送信できます。特別なコードの書き換えやフォームの改造は必要ありません。
メリット一覧
| 特徴 | 内容 |
|---|---|
| コーディング不要 | GTMでGUIから設定可能 |
| 柔軟なイベント取得 | wpcf7submitなどのカスタムイベントが発火 |
| 複数フォームも測定可能 | フォームごとに個別の設定が可能 |
| GA4との親和性が高い | コンバージョンイベントとして設定しやすい |
まずやるべき準備！GTMとGA4の連携チェック
GTMを使う前に、基本的な設定を確認しましょう。下記の項目をすべてチェックしてください。
チェックリスト
- GA4のタグがGTMで設定済みか
- 該当ページにGTMのコンテナタグが設置されているか
- GA4の計測IDが正しく設定されているか
これらが整っていないと、あとで送信イベントを取ろうとしても空振りになります。
Contact Form 7が発火するイベントとは？
CF7では、フォームの送信が成功すると、wpcf7submitというカスタムイベントがブラウザ上で発火します。つまり、GTMではこのイベントをトリガーとして使うことで、送信アクションを検出できます。
主なイベント一覧
| イベント名 | 意味 |
|---|---|
| wpcf7submit | フォーム送信完了（成功時） |
| wpcf7invalid | 入力エラーで送信失敗したとき |
| wpcf7spam | スパムフィルターでブロックされた時 |
| wpcf7mailfailed | メール送信に失敗した時 |
この記事ではwpcf7submitを中心に解説していきます。
実践編！フォーム送信イベントを取得する手順（GTM設定）
ここからは、GTMを使ってContact Form 7の送信イベントを取得し、GA4へ連携するための手順を、初心者にもわかりやすく説明します。
① カスタムイベントトリガーを作成する
- GTMの管理画面を開き「トリガー」を選択
- 「新規」→「カスタムイベント」を選ぶ
- イベント名に
wpcf7submitを入力 - このトリガーをすべてのカスタムイベントで発火するように設定
- 名前を「CF7送信トリガー」として保存
② GA4イベントタグを作成する
- 「タグ」→「新規」でGA4イベントタグを選択
- 計測IDを入力（すでにGA4設定タグがある場合は省略可）
- イベント名を
form_submitなど自由に設定（ただしGA4で意味が通じる名称が望ましい） - パラメータとしてフォーム名やURLなども設定可能
- トリガーに先ほど作った「CF7送信トリガー」を紐づける
③ プレビューとデバッグで動作確認
設定が完了したら、GTMの「プレビュー」機能でテストしましょう。フォームを送信して、wpcf7submitが発火しているか、GA4イベントとして送信されているかを確認します。Chromeの拡張機能「Google Tag Assistant」も活用すると便利です。
フォームを複数使っている場合の設定のコツ
サイト内に複数のContact Form 7フォームがある場合、それぞれのフォームごとにイベントを分けて測定したいこともあるでしょう。その場合は、formIdやformClassを使って識別するのがおすすめです。
識別方法の一例
| 方法 | 設定内容例 |
|---|---|
| CSSクラス | .wpcf7-form.cf7-contact |
| HTML ID | id="contact-form-1" |
| ページURL | /contact/ にのみ設定するなど |
GTMのトリガーで「条件付き発火」を使えば、フォームの特定が可能です。
GA4でのイベント確認とコンバージョン設定
GTMでイベント送信の設定が完了したら、次はGA4側での確認とコンバージョン設定を行いましょう。
① GA4の「イベント」レポートで確認
- GA4の管理画面にアクセス
- 左メニューの「イベント」を開く
- 数時間〜翌日を目安に、
form_submitというイベント名が表示されるか確認
② コンバージョンイベントとして登録
- GA4の「イベント」一覧から
form_submitを探す - 該当イベントの右側にある「コンバージョンとしてマーク」をON
- 今後、GA4のコンバージョンレポートでこのイベントが追跡されるようになります
便利なカスタムパラメータの設定方法
送信イベントに、送信されたページのURLやフォームの種別などを追加で計測したい場合は、カスタムパラメータを活用しましょう。
よく使われるパラメータ例
| パラメータ名 | 値の例 | 設定方法 |
|---|---|---|
| page_location | https://example.com/contact | {{Page URL}} 変数を使う |
| form_name | お問い合わせフォームA | カスタムJavaScript変数やDOM取得で指定 |
フォームの離脱分析も忘れずに！
「送信されたかどうか」だけでなく、「送信されなかった理由」を分析することも非常に重要です。
- 入力途中でページを離れた人をトラッキング（スクロールや滞在時間、
beforeunloadイベントなど） wpcf7invalidイベントを取得し、バリデーションエラーを把握- セグメントで「フォーム開始ユーザー」「送信完了ユーザー」を比較
GTMとCF7を使った送信計測のよくあるミスと対策
| ミス内容 | 対策 |
|---|---|
wpcf7submitイベントを大文字で書いてしまう | イベント名はすべて小文字・正確に入力する |
| トリガー条件に「一部のページ」で絞り忘れ | 特定ページだけ測定したいならURL条件を指定 |
| GA4イベント名にスペースを入れる | イベント名は英数字とアンダースコアのみ |
| プレビューで確認せずに公開する | 必ずGTMのプレビュー機能で動作確認 |
サンクスページがない場合の送信後リダイレクト設定
Contact Form 7は送信後にURL遷移しない仕様です。必要があればJavaScriptでリダイレクト可能です。
document.addEventListener('wpcf7submit', function(event) {
window.location.href = "/thank-you/";
}, false);まとめ
Contact Form 7とGoogleタグマネージャーの連携により、フォーム送信のトラッキングは非常に柔軟かつ正確に行えます。特別なコーディング知識がなくても、GUI操作と少しのイベント理解だけで運用可能です。
GA4と組み合わせれば、コンバージョン管理や広告効果の測定にも一役買ってくれるでしょう。
数字で語れるマーケターになるためにも、まずはフォーム送信の可視化からはじめてみてください。
