Weblasts

contactform7でのサンキューページと自動送信メール

サンキューページ

メールを送信したことを伝えるのと、そのお礼をするためのページになります。
サンキューページがあったほうが画面遷移してくれるのでメールを送信した感が出ます
ユーザーが本当に遅れているのかも確認できるのであると便利だと思います。

サンキューページを作る

サンキューページは固定ページを使って作ります
そのまま内容を本文エリアに記述してもよし、
カスタムテンプレートを使って作るもよし、
どちらでも実現可能です。
サンプルとして本文エリアに記述して作ってみました

contactform7側の設定をする

プラグインcontactform7の設定をしていきます
まずはサイドバーのお問い合わせの中からコンタクトフォームをクリックします。
登録してあるフォームが一覧で表示されますので、利用したいものを選びます。
コンタクトフォームの編集画面に移動しますのでフォームタブを開いていきます
フォームタブにはフォームのテンプレートが設定されていますがここにコードを追加していきます

JavaScript

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
  location = '送信完了ページのURL';
}, false );
</script>

ここでやりたいのはメールが送信できたときにサンキューページに飛ばす処理です
ContactForm7の送信イベント「wpcf7mailsent」を監視し、送信完了画面のURLへリダイレクトする仕組みになります
送信完了ページのURLは先ほど作った固定ページのURLを絶対パスで入れましょう

ここまでで、メールが送信時にサンキューページに移動する処理は終わりになります。
実際に試してみると送信完了後に画面遷移が起こり、送信完了用ページに移動してくれます

このままでも動き的に問題ないですが、サンキューページに行く前に送信完了もメッセージが出てしまいます。
これも修正しておきましょう
この設定はコンタクトフォーム内のメッセージタブから修正します
メッセージが正常に送信されたときのメッセージを送信中的なものに変えてあげればOK

ここまででサンキューページに移動する設定はおしまい

自動送信メール

メールを送信してくれた相手に送信直後お礼のメールを送り付けてあげましょう。
そうしておくと本当にメールが送れているのを確認できるので相手も安心かと思います。

contactform7での設定方法

コンタクトフォームの設定画面にメールタブがあります
下のほうにスクロールすると「メール(2)」のチェックボックスと入力欄が出てきます
ここに自動配信メールの設定をしていきます。
と、言ってもメッセージ本文にお礼の言葉を入れるぐらいなのでそこ以外は触らないほうが無難だと思います。 どうしても入力内容とかを追加したい場合は、メールタグが利用できますので利用すると良いでしょう。

この設定をするとページ内のフォームに入力してくれたメッセージは自分に届きます。
ページ内メールフォームのメールアドレス入力欄に入力してもらった利用者のメールアドレス宛に
メール(2)で設定した内容のメッセージを送信します。
ということで2種類のメールが送信されます

確認にはメールアドレスが必要になりますがやっておいて損はない内容だと思います

Recommend Post