WordPressで使うお問い合わせフォームのプラグインといえば、「Contact Form 7」がお馴染みです。
とても便利なプラグインですが、初めて使った時は手間取ったのを憶えています。しかし、最近になって「Contact Form 7」よりも設定が簡単な「WPForms」というプラグインがあると聞いて、実際に使ってみました。
目次
WPFormsのインストール
左メニュー プラグイン > 新規追加 をクリックします。
プラグインの検索に「WPForms」と入力し、「今すぐインストール」をクリック、「有効化」をクリックします。
WPFormsでフォームを作成
左メニュー WPForms > 新規追加 をクリックします。
フィールドを追加
「フォームに名前を付ける」のテキストボックスに任意の名前を入れます。
「テンプレートを選択」で好きなテンプレートを選びます。
今回は「空白のフォームを作成する」を選択しました。
「フィールドを追加」から使いたいフィールドをクリック、または右の画面へドラッグ&ドロップします。
フィールドを編集
追加されたフィールドをクリックすると、フィールド設定ができます。
ラベルの変更や、説明の追加、必須の選択を行います。
編集が終わったら、「フィールドを追加」をクリックし、次々に必要な項目を追加します。
先ほどと同じ手順でラベルの変更等を繰り返します。
順番を入れ替えたい時はドラッグ&ドロップで簡単に入れ替えることができます。
入力が終わったら、右上の「保存」ボタンをクリックしましょう。
通知の編集
フォームから情報が送信された時、デフォルトではWordPressで設定しているアドレス宛に通知メールが届きます。
お客様にも、自動返信メールが届くように設定を変更します。
左メニュー「設定」>「通知」をクリックします。
「送信先メールアドレス」の変更
「送信先メールアドレス」には、{admin_email}が入力されています。
右上の「スマートタグを表示」をクリックします。
「メールアドレス」をクリックします。
すると、{admin_email}の横に{field_id=”*”}が表示されます。(*の数字は設定によって異なります)
{admin_email}と{field_id=”*”}の間に半角のカンマ「,」を追加します。
設定をミスすると、どちらのアドレスにもメールが送信されなくなるので注意してください。
メール件名やメールメッセージの変更
仕様上、お客様と自分宛に届く通知メールが同じ内容になるため、お客様に向けたメール内容になるよう編集します。
メール件名やメールメッセージを変更すると良いでしょう。メールメッセージ内の{all_fields}は、お客様の入力してくださった内容をメール内に表示させるタグなので、消さないように注意してください。
入力が終わったら、右上の「保存」ボタンをクリックします。
reCAPTCHAの設定
スパム対策のため、reCAPTCHAを設定していきます。
右上の「×」ボタンをクリックし、フォームの概要ページに戻ったら、左メニューから「設定」をクリックします。
「CAPTCHA」をクリックし、「reCAPTCHA」をクリックします。
下にスクロールすると、サイトキーなどの入力画面が表示されるため、そこに必要な情報を入力し「設定を保存」ボタンをクリックします。
reCAPTCHAのキーが不明な場合、以下の手順で取得してください。
reCAPTCHAのキー取得
Googleにログインした状態でhttps://www.google.com/recaptcha/about/にアクセスし、「v3 Admin Console」をクリックします。
新しいサイトを登録する画面が表示されるので、情報を入力します。
ラベル…サイトのドメインを入力
reCAPTCHA タイプ…reCAPTCHA v3を選択
ドメイン…サイトのドメインを入力
reCAPTCHA 利用条件に同意する…チェックを入れる
「送信」ボタンをクリックする。
登録が完了し、サイトキーとシークレットキーが表示されます。
フォームへreCAPTCHAを設定
フォームの編集画面に入り、「reCAPTCHA」をクリックし保存します。
フォームを設置
いよいよ、ページにフォームを設置していきます。
左メニューから「すべてのフォーム」をクリックし、先ほど作成したフォームの「編集」をクリックします。
右上の「埋め込む」をクリックします。
「新規ページを作成」をクリックします。
任意の名前をつけ、右のボタンをクリックします。
新規固定ページ作成の画面が表示されるので、「公開」ボタンをクリックします。
必要に応じて、パーマリンクやアイキャッチ画像など変更してください。
このようなフォームを作ることができました。
必要に応じてCSSで見た目の調整を行ってください。
動作確認をして、問題なければ完成です!
まとめ
この記事を書くにあたって初めて「WPForms」を使いましたが、初めて使うプラグインなのに全くストレスを感じることなく使うことができました。
「Contact Form 7」と比べて、機能も遜色なく直感的にフォームを作ることができるので、初心者の方には「WPForms」の方がおすすめできると感じました。普段から「Contact Form 7」を使いこなしている方からすると、一部のフィールド(電話・日付/時間・サイト/URL等)と、メール通知の分岐が有料なのが不満に感じる点かもしれません。
どちらも優れたプラグインなので、柔軟に使い分けていきたいと思います。
「設定でつまづいた」「作業する時間が無い」という方、エクセレントでの代行も可能です。お気軽にご相談ください。