WordPressにSnow Monekey Formsでお問合せフォームを設置しました。
Snow Monkey Formsは、有料テーマSnow Monkeyに合わせて作られたプラグインですが、シンプルな機能、デザインで他のテーマでも使えます。
Emi当HPで使用中の「SWELL」でも問題なく設定できました。
この記事ではSnow Monkey Formsでお問合せフォームを作成する手順を紹介します。
確認画面つきのお問い合わせフォームを設定したい方
- Snow Monkey Formsでお問合わせフォームを作りたい方
- Google reCAPTCHAを入れてスパム対策したい方
- お問合せフォームで使える文例を知りたい方
Snow Monkey Formsの特徴
確認画面付きのシンプルなお問合せフォームを使いたい方におすすめです。
- ブロックエディタで入力項目の設定も簡単
- 確認画面がついてる
- レスポンシブ対応
- Google reCaptchaの設定も簡単
Snow Monkey Formsでお問合せフォームを作成する手順
- 入力画面でお問い合わせフォームの項目を追加する
- フォーム設定でデザイン/確認画面の有無などフォームの設定をする
- フォーム設定で自動送信メールを設定する
- 投稿/固定ページにお問い合わせフォームを埋め込む
プラグインのインストール
プラグインからSnow Monkey Formsをインストールすると、管理画面のメニューにSnow Monkey Formsが追加されます。


お問合せフォームの作成
管理画面 > Snow Monkey Forms > 新規追加
Snow Monkey Formsのメニューから新規追加をすると、お問合せフォームの作成画面にうつります。
初期表示ではお名前、Eメール、メッセージの入ったお問合せフォームが作成されます。
タイトルは「ブログお問い合わせフォーム」など、わかりやすい名前をつけておきましょう。


入力項目を追加する
- ブロックを追加することでお問い合わせの行を追加します
- 入力項目のラベルを入力します
- 内側の+を追加し、Snow Monkey Formsブロックを追加します


Snow Monkey Formsで用意されている入力項目
| テキスト | 名前などの文字 |
| テキストエリア | お問合せ内容など複数業にわたる文章 |
| URL | ホームページ、ブログなどのURL。URL形式に会う文字列のみ入力できます。 |
| 電話番号 | 電話番号を入力。数字以外は入力できません。 |
| メールアドレス | メールアドレスを入力、@のない文字列はエラーになります。 |
| セレクトボックス | プルダウンから選択肢を選びます |
| チェックボタン | 複数の選択肢から、該当する項目に複数チェックを入れます |
| ラジオボタン | 複数の選択肢から、一つのみチェックを入れます |
| ファイル | ファイルを添付できます |
入力項目のバリデーションや属性を設定
続いて、入力欄のブロックを設定して、右上の歯車ボタンをクリックしましょう。


必須入力チェック
必須入力にしたい場合はバリデーション:必須にチェックを入れましょう。


属性
属性
name欄に入力されている文字列は、自動返信メールに使います。
初期の入力項目は
- 名前→fullname
- Eメール→email
- メッセージ→message
となっています。
そのほか、属性に設定できる項目
| value | 入力値のデフォルト値 |
| placeholder | 入力欄に初期表示させたい文章 |
| maxlength | 最大文字数(0の場合は制限なし) |
| size | 項目の横幅を設定 |
| id | タグのidを指定。CSSなどでカスタマイズするときに使用 |
| class | タグのクラスを指定。CSSなどでカスタマイズするときに使用 |
セレクトボックス/チェックボックス/ラジオボタンの選択肢の設定
セレクトボックスなど複数の選択肢がある入力項目は、歯車をONにして右側の設定欄で選択肢を入れていきます。


完了画面の設定
入力画面の下に完了画面のメッセージ欄があります。
クリックすると、ブロックエディターで編集できます。


完了画面のメッセージ例
お問い合わせいただきありがとうございました。
折り返し、担当者よりご連絡いたしますので、恐れ入りますが、しばらくお待ちください。
ご入力いただいたメールアドレス宛に受付完了メールをお送りしましたのでご確認ください。
完了メールが届いていない場合には、メールアドレスが誤っているか、迷惑メールフォルダ等に振り分けられている可能性がありますので、再度ご確認をお願いいたします。フォーム設定を開く
フォーム設定は、入力画面の右にある「フォーム設定を開く」ボタンをクリックすると、右側に表示されます。


フォーム設定では確認画面、プログレストラッカー、自動返信メールの設定ができます。
確認画面/プログレストラッカー
確認画面を使用する:送信前に、確認画面を表示します。
プログレストラッカーを使用する:入力→確認→完了と進行状況を表示できます。


プログレストラッカー、確認画面を追加するとこのような表示になります。




自動返信メール
問い合わせ者宛と管理者宛に自動送信されるメールの内容を設定できます。


To
自動返信メールの宛先のメールアドレスを入力します
件名
自動返信メールの件名を入力します
Body(本文)
メールの本文を入力します。入力値の属性(name)を使うと、入力値を本文内に表示できるようになります。
From(メールアドレス)
初期設定では「wordpress@ドメイン名」になっています。お好みのメールアドレスに変更できます。
送信者
初期設定では「wordpress」になっています。お好みの名前に変更できます。
件名には自動返信メールのタイトルを入力します。
件名の記載例
【株式会社XXX】お問い合わせありがとうございました。Body(メールの本文)は初期値は{all-fields}となっています。
そのままだとこのように簡素なメール文章になってしまいます。
fullname:
〇〇〇
email:
〇〇〇
message:
〇〇〇入力項目の属性値の名前を使って、わかりやすいメールの文章にしましょう。
Body(本文)の記載例
※このメールはシステムからの自動返信です
{fullname} 様
この度はお問い合わせありがとうございました。
送信いただきました内容を確認の上、担当者よりご連絡差し上げます。
なお送信いただいた内容は、以下のとおりです。
———————————————-
■お名前
{fullname}
■フリガナ
{furigana}
■メールアドレス
{email}
■お問い合わせ内容
{message}
———————————————-
以上、よろしくお願い致します。
株式会社 XXX
Email: info@XXX.co.jp
Web: https://XXX.co.jp
- お問合せフォーム上で入力されたメールアドレスが間違っている
- フォーム設定の「To(メールアドレス)」欄に、メールアドレスの属性値{email}が正しく設定されていない
- メール内のフィールド名(例:{name}など)が、入力項目の属性値と合っているか
管理者宛の通知メールも同様に設定できます。


To
自動返信メールの宛先のメールアドレスを入力します
件名
自動返信メールの件名を入力します
Body(本文)
メールの本文を入力します。入力値の属性(name)を使うと、入力値を本文内に表示できるようになります。
From(メールアドレス)
初期設定では「wordpress@ドメイン名」になっています。お好みのメールアドレスに変更できます。
送信者
初期設定では「wordpress」になっています。お好みの名前に変更できます。
件名の記載例
【HP】お問い合わせ受付のお知らせBody(本文)の記載例
HPから問い合わせがありました。
※このメールはシステムからの自動返信です
———————————————-
■お名前
{fullname}
■フリガナ
{furigana}
■メールアドレス
{email}
■お問い合わせ内容
{message}
———————————————-お問い合わせフォームをページに追加
お問合せフォームを追加したい投稿/固定ページの編集画面を開きます。
「Snow Monkey Forms」のブロックを追加します。


プルダウンから作成したフォームを選択します。


お問合せフォームがページに埋め込まれます。


お問い合わせフォームの上に、注意事項などを書いておくといいかもしれませんね。
デザインの変更
フォームスタイル
フォーム設定のフォームスタイルから基本のデザインを選ぶことができます。


デザインは「Simple Table 」「Business」「Letter」と3種類用意されています。
Simple Table


Business


Letter


Google Recaptchaの設定
【追記】
GoogleのreCAPTCHAの仕様が2025年末にかけて変更されることになりました。
過去に作ったことがある方はreCAPTCHAキーの再取得または移行作業が必要になる可能性があります。
また、今後は10,000 件以上の使用は料金がかかるようになります。
無料で使用する場合は、CloudFlare TurnSiteを代わりに使用しましょう。
お問合せフォームのスパム対策のため、Google reCAPTHCAを設定します。
Google reCAPTCHAのサイトにアクセスします。
v3Admin Consoleをクリックします。


reCAPTHCAを導入するサイトの情報を入力します。




ここで、サイトキーとシクレットキーをコピーします。
Snow Monkey Forms > reCAPTCHA


コピーしたサイトキーとシクレットキーを貼り付けて、保存して完了。
以上で、お問合せフォームの設置は完了です。
ブロックエディタでお問合せフォームの項目を作成できるのがいいですね♪
お問合せフォームを設定したら、メール送信の機能もチェックしましょう
▼お問合せフォームから自動返信メールが届くようしっかり設定しておきましょう





