お問合わせフォームってなんか難しそうだけど教えてほしいな〜
お問い合わせフォームってなんだか難しそうですよね。
私も苦手でしたw
実際このブログに設置しているお問い合わせフォームも、
苦手意識からか、設置だけして設定をするのを随分長い間忘れてしまってました。
なんて事を・・・
この間、ご迷惑をおかけしてしまった方には本当に申し訳ありませんでした。
心よりお詫び申し上げます。
その反省を込めてではありませんが、
お役に立てたらとプラグインのSnow Monkey Formsを使用しての作成方法をブログにしてみましたので、
一緒に頑張って作成していきましょう。
プラグインのSnow Monkey Formsをインストール
まずはWordPressの管理画面のプラグインの新規追加をクリックします。
キーワードの場所に、Snow Monkey Formsと入力します。
Snow Monkey Formsが表示されたら、今すぐインストールをクリックします。
有効化をクリックします。
Snow Monkey Formsの設定
管理画面のSnow Monkey Formsの新規追加をクリックします。
Snow Monkey Forms 入力画面
とりあえずシンプルに、デフォルトの3件(お名前 Eメール メッセージ)の設定にしておきます。
タイトルは何でもいいので、お問い合わせにしておきます。
Eメールそのままでもいいのですが、私はメールアドレスに書き換えてます。
お名前の入力欄をクリックし画面右側ブロックを見ると、
属性のnameにfullmaneと表示されています。
お名前はfullnameと表示されている事を覚えておいてくださいね。
メールアドレスの入力欄をクリックすると、
属性のnameにemailと表示されています。
メールアドレスはemailです。
メッセージの入力欄をクリックすると、
属性のnameにmessageと表示されています。
メッセージはmessageです。
完了画面のテキストは相手が送信後に表示されます。
適した文章に変更してくださいね。
例)完了しました。
お問合わせありがとうございます。
2営業日以内にご連絡させていただきますので、しばらくの間お待ちいただけますよう、お願いいたします。
Snow Monkey Forms フォーム設定
フォーム設定を開くをクリックします。
フォーム設定 (Snow Monkey Forms ブロック)
画面右側ブロックのフォーム設定で確認画面を使用するとは、相手側が入力後に送信前に内容を確認できる画面を表示する事です。
その後に入力画面に戻るか送信になります。
使用したい場合はON
使用しない場合はOFFにしてください。
プログレストラッカーとは
この上にある表示です。
使用したい場合はON
使用しない場合はOFFにしてください。
フォームスタイルはお好みのものを選んでください。
管理者宛メール(Snow Monkey Forms ブロック)
To(メールアドレス)にお問い合わせが入った時に受け取るメールアドレスを入力します。
複数のメールアドレスで受け取りたい場合は、カンマで区切ってメールアドレスを入力してください。
例)abc@example.com, def@gmail.com
管理者(自分達)当てに向けたメールの件名なので、わかりやすい件名でいいです。
私はブログ名【穏やかな生活】お問い合わせが入りました
としています。
ここで先ほど覚えておいてくださいねとお願いしてた、
fullname
email
message
を其々{}で囲うと、そこに入力された文字が表示されます。
例)
●山田太郎
●〇〇○@〇〇.〇〇〇〇
●はじめまして。なんとかかんとか・・・
自動返信メール(Snow Monkey Forms ブロック)
自動返信メールとは、よくメールを送ったり何か購入した後に、相手側から確認のメールが送られてきますよね。
そのメールのことです。
自動送信メールのTo(メールアドレス)はデフォルトのままでないといけません。
ですので、このままです。
相手側にわかりやすい件名にするのがいいです。
例)【サイト名】お問い合わせありがとうございます。
or
【サイト名】お問合せありがとうございます。『自動送信』
{}の中にそれぞれ
お名前
メールアドレス
メッセージ
が入ります。
文面はお好きなようにアレンジしてくださいね。
最後にサイト名だけじゃなく、
会社や店舗などなら所在地や電話番号やメールアドレスやSNSなど入れるといいですね。
From(メールアドレス)を空欄にしておくと、相手から返信できない自動返信メールになります。
その場合
例)
このメールアドレスは送信専用となっております。
返信されませんようお願いいたします。
などと一言添えておくといいですね。
Form(メールアドレス)にメールアドレスを入力すると、相手からの返信がこのメールアドレスに届きます。
設定が終われば公開をクリックします。
ここでurlを見てみると、post=〇〇と数字が表示されているので覚えておいてください。
固定ページのお問合せにSnow Monkey Formsを設置
管理画面の固定ページのお問い合わせ(Contact)の編集をクリックします。
をクリックします。
画面左側ブロックの、下の方にあるSnow Monkey Formsをクリックします。
フォームを選択してくださいから先ほどのpost=〇〇の数字をクリックします。
公開をクリックします。
以上がSnow Monkey Forms のお問い合わせフォームの設定方法の解説になります。
おまけ(Snow Monkey Formsのボタンのデザインを変更する)
「確認画面へ」などのボタンはデフォルトでもシンプルで良いのですが、デザインを変更されたい方はこちらもご覧になってください。
管理画面の外観のカスタマイズをクリックします。
追加CSSをクリックします。
/*フォームボタン*/
.smf-action .smf-button-control__control {
background-image: none;
background-color: #1e73be;
border: none;
color: #fff;
}
.smf-button-control .smf-button-control__control:hover {
opacity: 0.6;
}
左記は一つの例ですが、
background-image
ボタンのグラデーションをnoneで無しにしています。
background-color
ボタンの色。
border
ボタンの縁をnoneで無しにしています。
color
文字の色になります。
:hover
カーソルを上に乗せた時
opacity
透明度で1が既定値です。
左記をコピペして、ボタンの色や文字色の部分、ボタンの上にカーソルを乗せた時のボタンの透明度をお好きなものに変更してください。
公開をクリックします。
まとめ
お疲れ様でした。
初めての方は少しややこしかったですよね。
今回はデフォルトの3項目の設定についての解説でしたが、Snow Monkey Formsにはこの他にもたくさんの項目があり、とても優れたプラグインです。
必要に応じて使用すれば良いのですが、基本的には不必要に項目をたくさん増やす事はお勧めしません。
なぜなら、項目が多すぎると途中で面倒になり離脱してしまう人が多いからです。
せっかくお問い合わせフォームまできていただいたのに、離れていってしまっては残念ですよね。
必要最低限の項目を作成するようにしましょう。
私もまたその他の項目設定の解説も記事に追加していきたいと思います。
〜本日も最後まで読んでいただき、ありがとうございました。〜
WordPressテーマSWELLを使ってのサイト制作の方法を詳しく解説しているデモサイト一覧です。