※contact form7でサンクスページに遷移したい。
※javascriptの「on_sent_ok」は2017年内に廃止予定。
※代替案としてfunction.phpに変更を加える。
通常、別ページへリダイレクトする場合
//functions.phpファイルに以下を記載 <?php //ここから add_action( 'wp_footer', 'mycustom_wp_footer' ); function mycustom_wp_footer() { ?> <script type="text/javascript"> if(jQuery('.wpcf7').length){ //formのclassが存在するか判定 var wpcf7Elm = document.querySelector( '.wpcf7' ); wpcf7Elm.addEventListener( 'wpcf7mailsent', function( event ) { location.replace('遷移先のURL'); }, false ); } </script> <?php } //ここまで ?>
複数ページでリダイレクトを使用する場合
管理画面からページ作成
※例えばコンタクトフォームを「メール相談」と「予約フォーム」の2種類作ったとする。メール相談のURLは
ドメイン名/contact/
そのページのサンクスページは
ドメイン名/contact/complete/
同様に予約フォームのURLは
ドメイン名/reserve/
そのページのサンクスページは
ドメイン名/reserve/complete/
fanction.phpを書き換え
コンタクトフォームを設置したページ、/contact/のページを開きF12キーで「class="wpcf7"」のコード部分を確認。
同列のidをコピー
メール相談部分の下記コード内if(jQuery('#wpcf7-f145-p62-o1') を2箇所ずつ書き換える。
同様に予約フォームif(jQuery('#wpcf7-f175-p54-o1') もIDを調べて書き換える。
※書き換えるIDはフォーム毎に異なります。
//functions.phpファイルに以下を記載 <?php //ここから add_action( 'wp_footer', 'mycustom_wp_footer' ); function mycustom_wp_footer() { ?> <script type="text/javascript"> // メール相談 if(jQuery('#wpcf7-f145-p62-o1').length){ //formのIDが存在するか判定,#を書き換える var wpcf7Elm = document.querySelector( '#wpcf7-f145-p62-o1' ); wpcf7Elm.addEventListener( 'wpcf7mailsent', function( event ) { location.replace('ドメイン名/contact/complete/'); //サンクスページのURLに変更 }, false ); } // 予約フォーム if(jQuery('#wpcf7-f175-p54-o1').length){ //formのIDが存在するか判定,#を書き換える var wpcf7Elm = document.querySelector( '#wpcf7-f175-p54-o1' ); wpcf7Elm.addEventListener( 'wpcf7mailsent', function( event ) { location.replace('ドメイン名/reserve/complete/'); //サンクスページのURLに変更 }, false ); } </script> <?php } //ここまで ?>