ワードプレスのお問い合わせフォームの定番プラグイン「ContactForm7」を使ったことのある方であればわかると思いますがコンタクトフォーム7では送信ボタンを押しても同ページ内に「送信されました。」など設定されて文言が表示されるのみでサンクスページ に移行することはありません。
しかし、ツナゲルを利用する場合のようにサンクスページのトラッキングを読み込む必要なこともあります。
そんな方のために、このページではコンタクトフォーム7で送信完了ボタンを押した後にサンクスページに移行させる方法を紹介しています。
サンクスページを作る
ワードプレスの固定ページでサンクスページを作ります。
サンクスページ自体はContactForm7の機能は関係なく、自由な内容で作成してください。
資料のダウンロードリンクやメルマガ登録フォーム、関連サービスの宣伝など自由に活用していただいて構いません。
コンタクトフォーム7の設定
コンタクトフォーム7編集画面の「フォーム」タブで、以下のスクリプトを追記します。
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://サンクスページのURL';
}, false );
</script>
ContactForm7の送信イベント(wpcf7mailsent)に対応し、送信完了画面のURLへリダイレクトする作りになります。
このようにできていれば大丈夫です。
送信ボタンを押した後のメッセージを修正
コンタクトフォーム7のメールフォームは、エラー時や送信時にメッセージを表示します。
デフォルトではフォーム送信時に「送信されました」というメッセージが表示されますが、ページがリダイレクトされる直前にこのメッセージが一瞬表示されます。送信完了ページに移る前に「送信されました」と一瞬でも見えることに違和感があるため、このメッセージを変えます。
コンタクトフォーム7編集画面の「メッセージ」タブで、「メッセージが正常に送信された」時の文言を「送信中」などに変更しましょう。
最後に正常に機能するかテストする
ここまでの作業が完了すればコンタクトフォームの送信ボタンを押すとサンクスページ にリダイレクトされるようになっているはずです。
作業完了後は必ずご自身でフォームに入力して正常に作動するか確認しておきましょう。
また、ツナゲルを利用する場合はフォームのあるページはLPとして使われていることが多いと思いますのでフォームの設置したページにアクセスタグを設置し、リダイレクト先のサンクスページにはトラッキングコードを貼り付けることを忘れないようにしましょう。
いずれも本文入力欄の下にある「headに出力するコード」に入力しておけば問題ありません。
LPやサンクスページのサイトがSSL(URLがhttps://で始まる)の場合はアクセスタグやトラッキングタグも「http://」から「https://」に変更しないとトラッキングのための通信が遮断されている状態となりますので成果が発生しなくなります。
サンクスページとLPのURLがSSL対応の場合は必ずアクセスタグ及びトラッキングタグのURLの「http://」の部分を「https://」に書き換えてください。