【WPCF7】ContactForm7にサンクスページ遷移を実装

WPCF7 contactform7 サンクスページ 実装
  • URLをコピーしました!
目次(クリックでジャンプ)

ContactForm7にサンクスページ遷移を実装する方法

①サンクスページを作成する

まずはWordPress管理画面の「固定ページ」でサンクスページを作成してください。
サンクスページの内容は以下のようなものを参考にしてください。

サンクスページの例(コピペOK)

この度はお問い合わせいただき、ありがとうございます。
担当者が確認の上、1~2営業日以内にご連絡いたします。

1~2営業日経っても連絡が無い場合、メール不達の可能性がありますので
恐れ入りますが再度お問い合わせください。

トップページに戻る(リンク)

②functions.phpファイルにコード追記

テーマファイルエディタ、もしくはテーマファイルをローカルで開いてfunctions.phpに以下のコードを追記してください。

適宜location = '/contact/thanks/'; の箇所は、正しいサンクスページのURLになるよう変更してください。

//サンクスページ遷移の実装
function add_thanks_page(){ ?>
        <script>
        document.addEventListener( 'wpcf7mailsent', function( event ) {
        location = '/contact/thanks/';
        //URLは適宜変更してください
        }, false );
        </script>
    <?php
}
add_action('wp_footer', 'add_thanks_page');

参考:https://contactform7.com/redirecting-to-another-url-after-submissions/

基本的にこれだけでサンクスページの実装が完了します。

おすすめのフリーランス向け求人・案件探しサービス

高単価案件、週3日~などフレキシブルな働きが可能な事が特徴の転職サービスです。案件をチェックするだけであれば無料の為、エンジニアやデザイナーの方は是非登録してみてください。

4275件と案件数豊富です(2024年4月現在)
WPCF7 contactform7 サンクスページ 実装

この記事が気に入ったら
フォローしてね!

役に立った!と思ったらシェアお願いします
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

フリーランスのWebデザイナー「Kizineko」です。Webサイトのデザイン~コーディング、簡易的なプログラム実装等、Web制作に係る広くに携わっております。当ブログでは日々のメモ帳として便利なコードなどを共有しております。

目次(クリックでジャンプ)