Contact Form 7でメール送信後に任意のページにリダイレクトさせる方法

Contact Form 7でメール送信後に任意のページにリダイレクトさせる方法

Contact Form 7でメール送信後に任意のページにリダイレクトさせる方法
  • シェアしてね♪
  • このエントリーをはてなブックマークに追加
  • follow us in feedly


  • Amazonギフト券を安く買って、予算内で商品が探せるサイト。
  • このエントリーをはてなブックマークに追加
  • follow us in feedly

以前、Contact Form 7でお問い合わせ時にサンクスページを表示させる方法という記事で、メール送信後にサンクスページにリダイレクトさせる方法をご紹介しました。フォームの「その他の設定」に以下のように記述することで、任意のページにリダイレクトさせることができました。

on_sent_ok: "location.replace('サンクスページのURL');"

しかしながら、on_sent_okとon_submitは2017年末に廃止される予定です。そこで今回は、on_sent_okを使ったリダイレクトの代替方法をご紹介したいと思います。

スポンサードリンク

Contact Form 7でメール送信後に任意のページにリダイレクトさせる方法

適用しているテーマのfunctions.phpに、以下のようなコードを追加します。

functions.php
function mycustom_wp_footer() {
?>
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location.replace('<?php echo home_url() . '/thanks'; ?>');
}, false );
</script>
<?php
}
add_action( 'wp_footer', 'mycustom_wp_footer' );

上記のように記述すると、「http://自サイトのドメイン名/thanks」にリダイレクトされます。

なお、これだとすべてのフォームがリダイレクトされますので、複数のフォームが存在していて、特定のフォームだけを指定してリダイレクトさせたい場合は、以下のように記述します。

functions.php
function mycustom_wp_footer() {
?>
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
if ( '1234' == event.detail.contactFormId ) {
location.replace('<?php echo home_url() . '/thanks'; ?>');
}
}, false );
</script>
<?php
}
add_action( 'wp_footer', 'mycustom_wp_footer' );

「1234」の部分でフォームのIDを指定します。フォームのIDは、ショートコード内の”id”から確認できます。

フォームのID確認

このように、フォームのIDを指定して、特定のフォームだけに適用することも可能です。

上記コードを追加したら、「その他の設定」に入れていたon_sent_okの記述を削除してください。

参考:on_sent_ok は廃止されます

あとがき

functions.phpを触る必要がありちょっと面倒になりましたが、on_sent_okが廃止されるので仕方ないですね。

Contact Form 7 Controlsというプラグインを使うと、リダイレクト設定が管理画面上からできるようになりますので、テーマファイルを触りたくないという場合は、プラグインの使用をご検討ください。

この記事が気に入ったら
いいね!してね♪

Twitter で
スポンサードリンク

関連記事

コメントを残す

メールアドレスが公開されることはありません。