【WordPress】Contact Formで複数フォームに別途サンクスページを設定する

要件

• サイト内にContact Formを使用したフォームが複数存在する
• サンクスページはフォーム毎に別のページを使用する

コード

functions.phpに以下のようにコードを追加します。

functions.php

<?php
add_action( 'wp_footer', 'add_thanks_page' );
function add_thanks_page() {
echo <<< EOD
<script>
    document.addEventListener( 'wpcf7mailsent', function( event ) {
    if ( 'フォームのID' == event.detail.contactFormId ) {
    location = 'サンクスページのURL';
    }
    else
    if ( 'フォームのID' == event.detail.contactFormId ) {
    location = 'サンクスページのURL';
    }
    }, false );
</script>
EOD;
}

フォームIDごとに条件分岐させ、サンクスページを設定します。
add_actionのあたりはざっくり言うと、フッターにこのscriptを書き出すfunctionを追加するよ！ってことです。

注意

仕様上Contact Form 7はサイト内で常に読み込まれます。
使っているページだけ読み込む処理を追加している場合は、Contact form7のJavaScriptが読み込まれません。そのため、カスタムDOMイベントが発生せずサンクスページに遷移できないことがあります💦
また、そのような処理をしていない場合でも、先にContact form7のJavaScriptが読み込まれる必要があるため、外部のJavaScriptから上記のコードを読み込ませたい場合は注意です。（wp_footerで追加させる上記の処理であれば問題ありません）