Contact Form 7でお問合せ後にサンクスページにリダイレクトさせる方法
お問い合わせページまたはお申し込みページなどで「Contact Form 7」などを使用される事がとても多いと思います。
Contact form 7でお問い合わせやお申し込みボタンを押した後、「内容を送信しました」という文言が表示されますが、ユーザー目線から客観的に見るとデフォルトの仕組みは「ちゃんと送信出来たのかな？」と思わせる事が多いです。
ユーザーがお申し込み内容、お問い合わせ内容を送信後にサンクスページなどにリダイレクトさせるコードをご紹介します。このコードを加えるだけでユーザーエクスペリエンスを大きく改善する事が出来ますのでぜひお試しください。
この記事の目次
Contact Form 7でお問い合わせ内容送信後にサンクスページへリダイレクトさせるJavaScriptコード
実装はとても簡単です。以下のJSコードをContact Form 7のお申し込みボタンの下のコードに追加するだけです。これでサンクスページまたは任意のページにリダイレクトする事が出来ますのでユーザーに不安を与える事なくお問い合わせ/お申し込みをスムーズ行っていただけます。
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'https://ここにサンクスページへのリダイレクト先URLをここに入れて下さい/';
}, false );
</script>
プロのWeb制作者として来訪していただいたユーザーに不安を与える事は極力排除していかなければいけません。ユーザの不安を取り除く事でUXを高める事が出来ます。
サンクスページを用意して、ユーザーに「ありがとう」と一言伝える事でWebサイトの成果も大きく変わるでしょう。
The following two tabs change content below.
鳥取県米子市出身。大阪市在住。
株式会社STACK ONLINE 代表取締役。2018年11月に株式会社STACK ONLINEを設立し、デザインの教育事業を展開。デザイナー歴17年。好きなデザインはシンプルで力強いデザイン。
最新記事 by 石原 誠之 (全て見る)
- お問い合わせフォームがスマホで拡大されてしまうのを防ぐ為のCSS - 2024年4月10日
- スマホで横スクロールが出た場合の解決方法 - 2024年4月3日
- Contact Form 7でお問合せ後にサンクスページにリダイレクトさせる方法 - 2024年2月10日
- inputボタンがiPhoneでダサいグラデーションになってしまう問題を解決するCSS - 2024年2月9日
- Webデザインの独学に必要な期間は6ヶ月に設定しよう - 2023年10月11日
この記事へのコメントはありません。