こんにちは、ゆうや(@yuyaphotograph)です!
この記事では、
- Contact Form 7でサンクスページを作りたいけどやり方が分からなくて困っている
- Contact Form 7でお問い合わせ送信完了後、初期状態の表示では味気ないのでサンクスページを用意したい
- Contact From 7でサンクスページを設置して次の行動を促したい
という方のお悩みを解決します!
プラグインを新たに追加しなくとも、ほんの数分で実装できますのでご安心を。
サンクスページを2ステップで実装!
Contact Form 7のお問い合わせフォームにサンクスページを設置するには、以下の手順で行います。
- サンクスページを固定ページで新規作成する
- functions.phpに「送信完了後にサンクスページへ遷移させる」コードを追加する
固定ページ新規作成
WordPress管理画面左メニューの固定ページ
> 新規追加
を選択。
サンクスページを作成しましょう。
スラッグは単純に「/thanks」でいいでしょう。
functions.phpに追記
以下のコードをfunctions.phpに追記します。
*はにわまんさんのこちらの記事のコードを参考にさせていただきました!
functions.php
add_action( 'wp_footer', 'add_thanks_wcf7' );
function add_thanks_wcf7() {
echo <<< EOD
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'サンクスページのURL';
}, false );
</script>
EOD;
}
location
で指定するURLはサンクスページのフルパスにしましょう。
以上、たったこれだけの作業でサンクスページ設置完了です!
まとめ
以上、Contact Form 7のお問い合わせフォームにサンクスページを用意する方法を紹介しました。
実際のWordPressを使ったWeb制作案件で使用したこともあるTipsですので、お役に立てれば幸いです!