WordPress お問い合わせフォーム

【WprdPress】Contact Form 7でフォームごとにサンクスページを振り分ける方法

Contact Form 7でフォームごとにサンクスページを分けたいんだけどどうすればいい?

1つのサイトにお問い合わせフォームが2つ以上ある場合、それぞれ別の目的で作られている事があり、サンクスページもそれに合わせて変えたい場合があります。

今回はその方法について書いていきたいと思います(サンクスページが1つの場合についても書いています)

またこの記事はオリジナルテーマでの作成を想定していますm(__)m

Contact Form 7でサンクスページを作る

Contact Form 7にはサンクスページの機能はないので、サンクスページはファイルから自作します。

これは固定ページのテンプレートを作るのと同じで、page-〇〇.php というファイルを作ります。

サンクスページであれば page-thanks.php といったファイル名になるかと思います。

そして今回はサンクスページが複数ある場合なので、page-thanks-recruit.php など別の名前のサンクスページを作成します。

 

functions.phpにページを振り分ける為のコードを書く

そして次にfunctions.phpにコードを書いていきます。

今回はサンクスページと採用案内ページの2つのページに分けるとします。

<?php
// Contact Form7の送信ボタンをクリックした後の遷移先設定
add_action( 'wp_footer', 'add_origin_thanks_page' );
  function add_origin_thanks_page() {
    echo <<< EOC
      <script>
        var thanksPage = {
          フォームID: 'http://〇〇〇〇〇〇〇〇/thanks/',
          フォームID: 'http://〇〇〇〇〇〇〇〇/recruit/',
        };
       document.addEventListener( 'wpcf7mailsent', function( event ) {
         location = thanksPage[event.detail.contactFormId];
       }, false );
      </script>
    EOC;
  }
?>

基本的にはこちらのコードをfunctions.phpにコピペして頂ければOKですが、ご自身で書き直す箇所が2か所あります。

まずはフォームIDです。

これは管理画面のお問い合わせから確認出来ます。

 

 

それぞれの編集画面からも確認出来ます。

 

 

この赤枠の54ですね。

これを入力するとこのようになります。

<?php
// Contact Form7の送信ボタンをクリックした後の遷移先設定
add_action( 'wp_footer', 'add_origin_thanks_page' );
  function add_origin_thanks_page() {
    echo <<< EOC
      <script>
        var thanksPage = {
          54: 'http://〇〇〇〇〇〇〇〇/thanks/',
          フォームID: 'http://〇〇〇〇〇〇〇〇/recruit/',
        };
       document.addEventListener( 'wpcf7mailsent', function( event ) {
         location = thanksPage[event.detail.contactFormId];
       }, false );
      </script>
    EOC;
  }
?>

 

次はページのURLです。

これはそのままですが、上記のコードの『http://〇〇〇〇〇〇〇〇/thanks/』の部分になります。

ここで注意点ですが、ローカル環境で作業していた場合ここのURLはローカルの物にしてテストすると思います。

その後本番サーバーへの移行をAll-in-One WP Migrationで行った場合、URLは自動では変わってくれないので、本番サーバーへ移行後に書き換える必要があります。

 

サンクスページが1つしかない場合

ここまではサンクスページが複数ある場合でしたが、1つしかない場合の方が多いと思います。

その場合はフォームIDは不要となり、以下のようになります。

<?php
// Contact Form7の送信ボタンをクリックした後の遷移先設定
add_action( 'wp_footer', 'add_origin_thanks_page' );
  function add_origin_thanks_page() {
    echo <<< EOC
      <script>
       document.addEventListener( 'wpcf7mailsent', function( event ) {
         location = 'https://〇〇〇〇〇〇〇〇/thanks/';
       }, false );
      </script>
    EOC;
  }
?>

以上になります。

-WordPress, お問い合わせフォーム