このは屋
自動返信メール機能付きフォームを作成する方法
「自動返信メール機能付きのフォームを作成したい！」
WordPressに限らずWebを運営していくと、こんな要望があります。
ただのフォームではなく、自動返信メールを返してくれるフォームです。
自動返信メールがないと、何度も入力してくるお客さんや、ちゃんとメールが届いているのかお問あわせをしてくるお客さんもいます。
確かに、相手からしたら申込み直後に返信がないとちゃんと申込みができているのか不安になるのも無理はありませんね。
こちらから手動で申し込み完了メールを送るのもかなりの手間です。
そんな手間を自動化して軽減してくれるのが、「Contact Form 7」というプラグインです。
Contact Form 7の基本的な使い方
まずは、インストールから。
インストール
WordPress管理画面から、「プラグイン」→「新規追加」→検索窓に「Contact Form 7」と入力。
検索結果から、「Contact Form 7」をインストール。
同時に必ず有効化も行ってくださいね。
使い方
有効化を行うとさっそくフォーム作成ができます。
WordPressプラグインContact Form 7の使い方 – 専門的知識は必要なし！フォームを簡単に作成できる方法
こちらの記事でも解説していますので、合わせてご覧になってください。
「WordPress管理画面→お問い合わせ→新規追加」で、設定画面に移動します。
まずは、投稿や固定ページのようにタイトルを簡単に入力してください。
次に四角で囲んだタブで、各種設定を行えます。
左から簡単に解説します。
フォーム
フォームの表示内容を設定できます。
- ラジオボタン
- チェックボックス
- ドロップダウンメニュー
- テキスト…etc
などフォーム作成に必要な項目は一通り揃っています。
HTMLなどのコードのように表示されますが、非常にシンプル化されているので見慣れると簡単に設定ができます。
メール
フォームから実際に登録があった場合のメール設定ができます。
管理人へのどんな人から登録があったのかのメール、申し込み者への自動返信メールを設定できます。
さきほどのフォームで設定した項目と連携して表示内容をカスタマイズすることができます。
メッセージ
ここでは、送信完了時のメッセージを自由にカスタマイズできます。
その他の設定
ここで、設定をすることで送信完了後にサンキューページに移動させることができます。
コードを扱うのですが、変更箇所は一つだけなので、初心者の方でも十分設定可能なんです。
後ほど解説いたします。
設定が完了したら、必ず「保存」をクリックしてください。
フォームの設定
フォーム内容の設定が完了しましたら、ショートコードをコピーしましょう。
設定内容を複製することもできるので、似たようなフォーム作成する際に効率的ですし、量産することが可能です。
あとは、ショートコードを固定ページ貼り付けるだけでフォームが作成できます。
実際に公開したページが以下になります。
このように非常に簡易的にフォームが作成できます。
あとは、実際に手を動かしてみるとイメージがつかめるかと思います。
自動返信メールの設定
続いて自動返信メールの設定です。
まずは、メールタブに移動してください。
「メール」の設定では、自分がこんな人からお問い合わせがあったことを確認できるメールになります。
ですので、自分が受け取ったときにわかりやすいようにカスタマイズしましょう。
送信先も受取りやすいメールアドレスがいいです。
[your-name]といったコードがありますが、これは「フォームタブ」で設定したものが連動しています。
画像に記載したお名前(必須)フォームで入力した内容が、[your-name]で反映されることになります。
見慣れないと少しややこしいですが、
[text* your-name]のyour-nameと
メールタブ設定の[your-name]が連携しているイメージです。
メール(2)では、自動返信メールの内容をカスタマイズできます。
まずは、一度作成してみてご自身のメールアドレスを入力し、テストをしてみるとイメージしやすいかと思います。
その他の設定
こちらにカスタマイズ用にコードを貼り付けることで、サンクスページに移動させる事ができます。
設定コード
「on_sent_ok: “location = ‘サンクスページURL’;”」
「on_sent_ok: “location.replace(‘サンクスページURL’);”」
「on_sent_ok: “location.href = ‘サンクスページURL’;”
on_sent_ok: “return;”」
「on_sent_ok: “window.location.href =’サンクスページURL’;” 」
こちらのコードを入力すると、サンクスページに移動することができます。
この機能があると非常に便利です。
Contact Form 7の解説【応用編】
Contact Form 7の活用事例
実際にどのように活用していくかを解説していきます。
WordPress内で幅広く活用できるのはもちろんですが、使い方によっては他のWebサービスと連携も可能です。
例えば、このは屋ではペライチと連携しています。
ペライチでは有料にするとフォームが配置できるものの、自動返信メール機能がないため、お申し込みいただいた方から「ちゃんと届いていますか？」といった連絡が多数ありました。
そこで、ペライチのお申し込みボタンに固定ページで作成したフォームのURLを指定し、自動返信メール機能を上手く活用しています。
また、facebook広告にペライチで作成したLPを出稿する場合にもサンクスページに移動できる機能があるため、「カスタムコンバージョン」を設定することもできます。
※カスタムコンバージョンとは、コンバージョンを測定する設定です。
編集後記
WordPressの固定ページとContact Form 7を活用すればフォームを簡単作成できます。
一度作成したものを複製すれば、簡単に量産することも可能ですので非常に便利です。
ペライチに限らず、URLを指定すれば固定ページに移動できるので他のWebサービスでも、ぜひ活用してみてくださいね。
