送信完了メッセージ
初期状態では送信完了後、フォームの下に送信完了のメッセージが表示されます。
こちらの表示をフォームより上部に表示させるには、フォームの設定画面で
[response] というコードを表示させたい場所に入れることで可能です。
送信完了後はフォームを表示させない方法
送信完了すると、formタグのclassにsentが付与されます。
そこで以下cssを追加すると非表示になります。
form.sent {
display:none;
}
サンクスページは必要ない場合は上記方法で多少のカスタマイズが可能です。
サンクスページの設定
公式ではサンクスページは不要とありますが、Yahooのコンバージョンを入れるために等
どうしてもサンクスページが必要な場合があります。
サンクスページの追加はいたって簡単です。
以下のJavaScriptを追加すれば大丈夫です。
フォーム設定画面の一番下に入れても大丈夫ですし、head内、function.phpでもOKです。
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'サンクスページのURL';
}, false );
</script>
サンクスページのJavaScriptがきかない
上記JavaScriptを設定したにも関わらず、サンクスページにリダイレクトしない場合は
以下を確認してみてください。
<?php wp_head;?>と<?php wp_footer;?>
WordPressのテンプレートのheader.phpに<?php wp_head;?>、footer.phpに<?php wp_footer;?>を
必ず閉じタグの前に入れる必要があります。
WordPressには必要なタグなので、記載忘れがないか確認してみてください。
jQueryの設定
実は私がはまってしまったのが、Wordpress標準のjQueryを無効にして最新のjQueryを
呼び込んでいたため、サンクスページのリダイレクトのJavaScriptが動きませんでした。
もし最新のjQueryを使いたい場合は<?php wp_head(); ?>より上部に記載すると併用可能だそうです。
コメント