Contact Form 7 の送信後にサンクスページへ遷移させる方法:DOM イベントでの手順と GA4 での数え方

Contact Form 7 は、送信が終わってもページを移らず、同じページのフォームの下に完了の文を出す作りです。送信後にサンクスページ(お礼のページ)へ遷移させたいときは、公式が案内している方法で、メールの送信が済んだときに出る合図(DOM イベント)の wpcf7mailsent を JavaScript で受け取り、そこでページを移します。以前よく使われていた on_sent_ok の設定は、公式の日本語の説明で「非推奨になっており現行の Contact Form 7 では機能しません」とされています。送信の数を GA4 で数えるのが目的なら、サンクスページを作らなくても、同じ合図で数えられます。

この記事は、Contact Form 7 の公式ドキュメントと FAQ を2026年11月14日に確かめた範囲で書いています。

作る前に:サンクスページは本当に要るか

公式の「送信後に異なる URL にリダイレクトさせるには」は、この方法が要るのはごく少数の人で、使うことは勧めない、という立場で書かれています。リダイレクトについての質問の多くは、Google アナリティクスで送信を数えるにはサンクスページが要る、という思い込みから来ているとし、「実際、リダイレクトなどしなくても Google Analytics でフォーム送信をトラッキングできるのですから。」と続けています。

当社の見立てでは、サンクスページが役に立つのは、送信のあとに、返信までの目安、営業時間、次に読んでほしい案内などを、フォームの下の一行より詳しく見せたいときです。数えるためだけなら、作らなくてかまいません。

遷移させる手順(wpcf7mailsent を使う)

公式の説明に載っている例は、次の短いスクリプトです。メールの送信が済んだら3秒待って、指定した URL に移ります。http://example.com/ の部分を、自社のサンクスページの URL に書き換えて使います。

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
  setTimeout( () => {
    location = 'http://example.com/';
  }, 3000 ); // Wait for 3 seconds to redirect.
}, false );
</script>

公式の「DOM イベント」の説明では、Contact Form 7 が出す合図は次の5つです。サンクスページへ移すのに使うのは、メールの送信まで済んだときだけ出る wpcf7mailsent です。

  • wpcf7invalid:入力に不備があり、メールを送らなかったとき
  • wpcf7spam:迷惑な送信と見なされ、メールを送らなかったとき
  • wpcf7mailsent:メールを送ったとき
  • wpcf7mailfailed:メールの送信に失敗したとき
  • wpcf7submit:結果にかかわらず、送信の処理が終わったとき

wpcf7submit を使うと、入力の不備で送れなかったときにもサンクスページへ移ってしまいます。取り違えないようにします。

一つのフォームだけ移したいとき

上の例は、ページの中のどのフォームでも送信が済めば移ります。お問い合わせと資料請求のように複数のフォームがあって、一つだけ移したいときは、合図の中身(event.detail)にあるフォームの ID(contactFormId)で絞ります。公式の「DOM イベント」の説明に、この項目が載っています。次は形の例です。123 を自社のフォームの ID に、URL を自社のサンクスページに置き換えます。

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
  if ( event.detail.contactFormId == 123 ) {
    location = 'https://example.co.jp/thanks/';
  }
}, false );
</script>

フォームの ID は、「お問い合わせ」→「コンタクトフォーム」からそのフォームの編集画面を開いたときのアドレス(URL)に含まれる、post= のあとの数字です(当社の見立て。WordPress の投稿の ID と同じ考え方です)。送って移らないときは、まず ID の数字を見直します。

スクリプトを置く場所

公式の説明は、このスクリプトをテーマのテンプレートファイルに埋め込むよう書いています。公式の「Google アナリティクスでのフォーム送信のトラッキング」の例では、テーマの functions.php で wp_footer のアクションフックを使い、ページの末尾に出力する形が示されています。テーマのファイルを直接書き換えると、テーマの更新で消えることがあるので、子テーマに書くか、コードを足すための仕組みを使います。子テーマの考え方はWordPressのテーマの更新方法に書きました。

移らないとき・思わぬときに移るとき

公式の FAQ では、wpcf7mailsent などの合図は、ページを読み直さずに送る方式(Ajax)で送ったときにだけ出ます。Contact Form 7 の JavaScript を読み込ませない設定にしていると、合図は一つも出ません。ほかの JavaScript のエラーで処理が止まっていることもあるので、ブラウザの開発者ツールでエラーが出ていないかを見ます。メールは届くのに移らない、というときはここを疑います。確認画面を足すプラグインを入れている場合は送信の流れが変わるので、入れたあとに移動を試します(Contact Form 7 の確認画面)。

逆に、移るのはメールの送信が済んだときだけです。入力の不備、迷惑な送信の判定、メールの送信の失敗のときは移らず、フォームの下に表示が出ます。サンクスページに着いたことは、メールを送り出したことを表しますが、相手に届いたことまでは表しません。

サンクスページを作るときに決めておくこと(当社の見立て)

  • サンクスページは、フォームを通らずに URL を打って開くこともできるページです。表示の回数を送信の数として扱うと、再読み込みやブックマークからの表示も数に入ります。
  • フォームの下の完了の文は、移る前に少しのあいだ出るだけになります。それでも、移動がうまくいかなかったときのために、完了の文は消さずに残しておきます。
  • サンクスページの本文には、受付のメールが届くこと、届かないときの連絡先を書いておくと、送った人が迷いません。通知が社内に届かないときの確かめ方はContact Form 7 でメールが届かないときに書きました。

GA4 で送信を数えるなら:サンクスページより送信の合図で

公式の「Google アナリティクスでのフォーム送信のトラッキング」の例は、サンクスページを使わず、同じ wpcf7mailsent の合図を受けて GA4 にイベントを送る形です(例のイベント名は wpcf7_submission)。当社のサイトでも、同じ合図で GA4 の推奨イベント generate_lead を送っています。この数が何を数えていて何を数えていないか、という考え方はGA4で問い合わせを計測するにまとめました。送ったイベントが届いているかは、GA4のリアルタイムレポートで確かめられます。

サンクスページへ移す設定とイベントを送る設定は、同じ合図に別々にぶら下がります。両方入れるなら、移る前にイベントが送られるよう、移るまでの待ち時間を残しておきます(当社の見立て)。

今日、自社で確かめられること

  1. フォームから一通送り、サンクスページに移るか、移り先の URL が正しいかを見ます。
  2. 必須の欄を空けたまま送り、移らないことを見ます。
  3. フォームが複数あるなら、ほかのフォームから送って、意図しない移動が起きないかを見ます。
  4. GA4 のリアルタイムで、送信のイベントが一件だけ記録されたかを見ます。
  5. テーマやプラグインを更新したあとも、同じことを確かめます。

参考にした公式の情報

いずれも2026年11月14日に内容を確かめました。プラグインの表示名は、版や言語の設定によって変わることがあります。