Contact Form 7で複数のフォームごとに送信完了後のリダイレクト先ページを用意する方法

WordPressのContact Form 7のメールフォームを複数設置して、メール送信完了後のリダイレクト先を複数指定したいときの分岐処理をご紹介します。

会社やお店のホームページだと、お問い合わせフォームや採用エントリーフォーム、御見積フォーム、注文フォームなど複数のメールフォームが必要になる場合があると思いますが、メール送信後の着地ページを全部分けたいという要望にも応えることができる、便利なカスタマイズとなっております。

Contact Form 7でメール送信完了後のリダイレクト先を複数指定するには?

メールの送信完了後に、指定のページにリダイレクトさせる方法は、以下の関連記事で紹介していますので、これの追加カスタマイズになります。

WordPressのContact Form 7で送信完了画面を設置する方法

2019年1月26日

上記ページで紹介しているとおり、テーマフォルダ内のfunctions.phpを編集するんですが、Contact Form 7のお問い合わせIDごとに、リンク先を変更する処理を追記する必要があります。

Contact Form 7でフォームごとに別々のリダイレクト先を指定する

お問い合わせID「1」と「2」の2つのフォームを例に、具体的なコードを見ていきます。

●お問い合わせID「1」のリダイレクト先がthanks.htmlの場合

add_action( 'wp_footer', 'wpcf7_mailsent_location1' );
function wpcf7_mailsent_location1() {
?>
<script type="text/javascript">
document.addEventListener('wpcf7mailsent',function(event) {
    if ('1' == event.detail.contactFormId) {
        location.replace("<?php echo home_url('/');?>thanks.html");
    }
},false);
</script>
<?php
}

お問い合わせID「2」のリダイレクト先がfinish.htmlの場合

add_action( 'wp_footer', 'wpcf7_mailsent_location2' );
function wpcf7_mailsent_location2() {
?>
<script type="text/javascript">
document.addEventListener('wpcf7mailsent',function(event) {
    if( '2' == event.detail.contactFormId) {
        location.replace("<?php echo home_url('/');?>finish.html");
    }
},false);
</script>
<?php
}

ポイントは、どちらのコードも

❶6行目にif文でお問い合わせフォームのIDを入れ
❷7行目に送信後の遷移先であるURLを指定する

という点です。

2つ以上の複数メールフォームがあっても対応できるので、Contact Form 7を使ったフォームであれば業種を問わず使えるカスタマイズじゃないかと思います★

関連記事

コメントを残す