- これで解決！「SWELLでのお問い合わせフォームの設定【Contact Form by WPForms】」
－本記事の要約と結論－
本記事を読めば、SWELLのブログサイトに「お問い合わせフォーム」の設置・設定ができるようになります。
まず、ブログに「お問い合わせ」が必要かどうかですが、結論から言うと設置するのが必須だと言えます。仮に連絡手段がないということでは、ブログの信用の低下にも繋がりますし、万が一記事がトラブルになっても対処することすらできません。もちろん連絡が付かないようなサイトは商品も売れませんし、ソーシャルメディアでも拡散してもらえません。
そこで今回は、プラグインのContact Form by WPFormsを導入・設定し、メールフォームを使えるようにしていきます。SWELL公式サイトでも推奨されていますので安心して利用できますよね。Contact Form by WPFormsは、テンプレートが豊富で直感的に扱えるので、初めてメールフォームに触れる方でも、比較的容易に導入できるでしょう！
また、Contact Form by WPFormsでメールフォームは設置できてもスパムメールは届いてしまいますので、併せてスパム対策も実行していきます。スパム対策には、Google reCAPTCHAを設定していきます。
Contact Form by WPFormsとGoogle reCAPTCHAと両方とももちろん無料です。
このお問い合わせフォームがあることで、ユーザーからの安心感や信頼性が高まるだけでなく、検索エンジンからもより信頼性の高いブログと評価されますので、SWELLを使っているのだけれども、まだメールフォームの設置が終わってない方は、お役立てくださいね！
メチャじじそろそろ、自分のサイトに『お問い合わせフォーム』を設置したいのじゃ！・・・・
あるのとないのじゃ、ブログの信用度がまるで違うのじゃ！！
いいお問い合わせフォームがあったら教えて欲しい・・・
アフィリエイトに挑戦するなら、問い合わせができないと、いろいろ審査に通らなかったりするんだよね。
ひろおじじゃあ今日は、SWELLに相性のいいお問い合わせフォームの設定をしていきましょう。プラグインは【Contact Form by WPForms】をご案内します。
この記事では、健全なブログ運営をするのに必要な『お問い合わせフォーム』について、導入も含めてお話をしていきます。
- ブログにお問い合わせフォームを設置したい方
- ブログの信用度信頼度を上げたい方
- アフィリエイトにチャレンジしたい方
早く希望の記事箇所に到達したい方はコチラ
- お問い合わせフォームの必要性
- お問い合わせフォームは、ユーザーにもWEBサイトにも便利
- SWELLでオススメのお問い合わせフォーム
- Contact Form by WPFormsのインストール｜SWELL
- Contact Form by WPFormsの導入・設定
- Google reCAPTCHAの登録、設定方法【スパム対策】
- お問い合わせフォームでGmail等のエラーを解決
当ブログでは、初心者が快適なブログ運営をするために必要な『エックスサーバー』と『SWELL』の説明。そしてWordPress導入後、10記事書くまでに必要なWordPressとSWELLの設定、必要なプラグイン等の徹底解説をしております。ぜひご活用くださいませ！
お問い合わせフォームの必要性
そもそも連絡先は、なしでもよくないか？
- 自分でブログ作って発信するだけなら、別に『お問い合わせ』なんていらないんじゃないの？
- なんか面倒そうだから、お問い合わせはなしでいいか？
- まだ、全然アクセスないし、半年後でいいか！
でもですよ、記事に重大な欠陥があったり、何らかのクレームにつながるような事があっても運営者に連絡がつかない・・・・
こんなことがあったとしたら、大変なことになるのは容易に想像がつきますよね。
メールで連絡がつけば対応・対処することもできますが、連絡がつかないと深刻なトラブルに発展しかねません。
情報媒体を運営する上で『お問い合わせ』ができる事は、運営者と連絡が取れる事になりますので、リスク回避にも大いに役立ちます。
ひろおじ情報を発信する側として、最低限のマナーだと認識したほうがいいね！
お問い合わせフォームは、ユーザーにもWEBサイトにも便利
お問い合わせフォームとは？
お問い合わせフォームは、あらかじめ入力フォームを設定できるようになっており、訪問者がフォームに沿った入力だけで問い合わせができる機能です。
電子メールですと、メールアプリを立ち上げてメールアドレスや本文を入力する操作がありますので、面倒だと感じる人もいますし、利用率がぐっと下がります。問い合わせフォームがあれば電話やメールを使う必要がなく、利用のハードルを下げる効果が見込めます。
『お問い合わせフォーム』を設置するとWordPressのWebサイト運営者やブログ運営者は、自分のメールアドレスを公開せずに訪問者とコンタクトが取れるようになります。
お問い合わせフォームのメリット
便利なお問い合わせフォーム設置・設定には、こんなメリットがあります。
- ユーザーにとって、直感的にわかりやすくメールしやすい
- 「氏名」「住所」「メールアドレス」などwebサイトが側が必要な情報を取得
- 入力間違いの防止
- 自動返信機能による作業の軽減、ユーザーへの安心感
- 迷惑メールを防げるメリット
お問い合わせフォーム作成の注意点
お問い合わせフォームの入力項目が多すぎると、問い合わせ際の入力意欲が下がってしまいます。なるべく必要最小限にして、入力のハードルを下げることが必要です。また、設定項目によっては入力したくない情報も存在します。個人情報にもつながりますので、配慮して作成する必要があります
お問い合わせフォームのメールは、迷惑フィルターなどに引っかかってしまいメールが届かないことがあります。メールフォームを設置・設定しても、メールが届かないでは本末転倒になりますので、設定方法を確認して対処する必要があります。
副業やアフィリエイトを目指す方は、お問い合わせフォームは必須
副業として、ブログを運営したり、アフィリエイトを目指す方にとっては、お問い合わせフォームの設置は必須になります。商品を販売したり紹介するのに連絡をつけることができないのでは、ユーザーから不信感を抱きますし、広告サービス会社からは、お問い合わせがしっかりしてないと審査すら通らないことがあります。
お問い合わせフォームは、安心感、信頼感につながる
WEBサイトやブログに問い合わせ先がないことは、運営者側からの一方的な情報の提供ということになるので、信頼性に欠けるということになります。ユーザーは、「連絡がつかない＝怪しい」と連想しますので、せっかく内容の良いWEBサイトやブログであっても、一気に信頼感が下がってしまいます。お問い合わせをするかどうかは別として、お問い合わせフォームが設置してあるだけで、ユーザーは安心感や信頼感を持つことができます。
SWELLでオススメのお問い合わせフォーム
SWELLさんの公式サイトでどんなお問い合わせフォームを導入すればいいかちょっと見てきましたところ・・・
Contact Form by WPForms
シンプルなお問い合わせフォームが超簡単に設置できるプラグイン。コンタクトフォーム系は「Contact Form 7」が世界的に人気ですが、私はいつもこっちを使ってます。
SWELL公式
と紹介してくれました。
「Contact Form 7」はよく聞きますし、利用者も多いですが、Contact Form by WPFormsを使って見えるということでしたので、ここでもContact Form by WPFormsを導入・設定していきます。
Contact Form by WPFormsのインストール｜SWELL
Contact Form by WPFormsのインストール
- ダッシュボードから『プラグイン』を
- キーワード『WPForms』で検索。
- Contact Form by WPFormsを『今すぐインストール』
以上でContact Form by WPFormsのインストールのインストールは終了です。
Contact Form by WPFormsの導入・設定｜SWELL
簡単、簡単って書いてありますけど、最初は作動しないと困るので恐る恐る進めてましたが、気にいらなかったら削除して作り直せばいいので、気にせず作業しましょう。
- うまくいかなかったら、ゴミ箱へ
- 新規追加で作りなおしましょう。
進め方の順番として、
- 固定ページでお問い合わせページ作成
- Contact Form by WPForms内でお問合せフォームの作成
- 作成したお問い合わせフォームを固定ページへの貼り付け
- メールの動作チェック
1、固定ページでお問い合わせページ作成
まず、固定ページで『お問い合わせ』ページを作成します。
Contact Form by WPForms内で作成した『お問合せフォーム』がそのまま貼り付けできるようにあらかじめ準備しておきます。
ダッシュボードから『固定ページ』
- 『お問い合わせ』を入力します。
- パーマリンクをcontactに設定します。
- 『公開』して『お問い合わせ』ページを作成します。
パーマリンクがよくわからい方は、
2、Contact Form by WPForms内でお問合せフォームの作成方法
お問合せフォームの表示
- フォームに名前を付ける欄に『お問い合わせフォーム』を入力
- 簡単なお問い合わせフォームから『テンプレートを使用』
少しお問い合わせフォームを修正してみましょう。
『コメントまたはメッセージ』欄をクリック
- 『コメントまたはメッセージ』から『お問い合わせ内容』に変更してみました。
右のプレビューみたいに表示されるんじゃな！
フィールド欄をいろいろ触ってみて自分なりに作ってみよう。
必須欄をONにすると、必須項目になります。
メール送信等の設定
これは、デフォルトの状態です。
通知
『スマートタグを表示』
このようになります。
で入力しています。
送信元アドレスも送信先アドレス（自分用）を入れておきましょう。
自動返信メールがどのような形なのかを決めます。下記タグをそのまま最後に入れます。
確認
ここで言う確認とは、お問い合わせフォームでメールを送った際にそのままブログ上で表示されるメッセージの事です。送信者に伝えたいメッセージを入力しましょう。
ここまで出来ましたら、保存をしましょう。
もちろん、作業中はこまめに保存しておいたほうが良いでしょう。
3、作成したお問い合わせフォーム（Contact Form by WPForms）を固定ページへ貼り付けする方法
ここからは、作成したお問い合わせフォームを固定ページ『お問い合わせ』に埋めこんでいきます。円滑に進めるため、冒頭で説明したように、お問い合わせページ（固定ページ）を事前に作成しておく必要があります。
チョイじじまだの方は先にお問い合わせページ(固定ページ)を作ってくださいね！！
ではいきましょう！
このプルダウンは、固定ページを表示しています。
この冒頭で作成した固定ページ『お問い合わせ』を選択
『行きましょう』をクリックして『お問い合わせ』ページへ行きましょう！
追記
- 二つ目のブログを作った際、固定ページの作業画面においてこの出来上がった表示がされませんでした。プレビューや投稿するとちゃんと表示されますが、作業画面には全く表示がありませんでした。各々人によって環境が違いますので必ずそうなるわけではないですが、ちょっと戸惑いました。一応伝えておきます。尚、お問い合わせフォーム自体は問題なく使えます。
4、メールの動作チェック
念のためメール動作のチェックをしてみましょう。
ためしに以下のように入力してみます。メールアドレスは、このサイトとは関わりのないアドレスを入力しています。
送信ボタンを押すと画面上では、『確認』で設定した画面が表示されます。
今回メールアドレスをOutlook（相手先）にしてみましたので、そちらを見てみましょう。
メールメッセージの記入のように表示されています。
今回自分は、Gmailに設定したので、Gメールを確認してみました。
同じように届いていました。
ひろおじひろおじも最初はちょっと時間かかった割には、なんか気に食わなかったので何度か作り直しました。でも作り直しはとてもスムーズにできましたよ！！
メチャじじほう～、でもさ〜、スパムメールがメッチャ来るって聞いたんじゃ！その辺は大丈夫なのか？
それはヤバイね。
ひろおじじゃあ、そのままメールやコメントを守るGoogle reCAPTCHAを入れていこう。
Google reCAPTCHAの登録、設定方法【スパム対策】
『お問い合わせフォーム』を設置しましたが、コメント同様、スパムが届くようになります。
近年では、お問い合わせフォームを悪用したスパムが多く発生しているため、スパム対策は必ずしておきましょう。
ここでは、『お問い合わせフォーム』のWordPressプラグイン『Contact Form by WPForms』を導入しましたのでセキュリティーツール『Google reCAPTCHA』の登録、設定方法を紹介していきます。
「reCAPTCHA」は、Googleが無料で提供している認証ツールです。
現在、Google reCAPTCHAではバージョンが、「v3」になっているのですが、今回導入したプラグイン『Contact Form by WPForms』には、
『Invisible reCAPTCHA v2』をオススメしておきます。
メチャじじでわ、早速やってみるのじゃ！！
Google Invisible reCAPTCHA v2の登録方法
任意の好きな名前を付けましょう。
今回『Contact Form by WPForms』を導入してますので、『チャレンジ（v2）』を選択。
下部は『非表示 reCAPTCHA バッジ』を選択します。
これは、必ず「私はロボットではありません」とチェックボックスを表示するのではなく、必要な場合に表示してくれるものです。
ドメイン名を入力します。 https://等は必要ないです。
ここまで設定したら規約を理解し『送信』をクリック
送信しますと、サイトキー・シークレットキーが表示されますので、消さずにそのままキープしておいてください。
チョイじじ心配ならメモ帳などにコピペしておいてね！
Google Invisible reCAPTCHA v2のContact Form by WPFormsへの設定方法
ここからは、お問い合わせフォーム『Contact Form by WPForms』へセキュリティーツール『Google reCAPTCHA』を設定していく方法をお伝えします。
ダッシュボードから『WPForms』
『CAPTCHA』タブを選択し『reCAPTCHA』カードをクリック
そのまま下へスクロールしてもらいますと、設定部分が出てきますので、
- タイプは、 Invisible reCAPTCHA v2
- Google Invisible reCAPTCHA v2で取得したサイトキー・シークレットキーを貼り付けます。
- 設定を保存します。
ダッシュボードから『すべてのフォーム』選択
下記のような注意書きがでますので、『OK』をクリック
『reCAPTCHA』有効バッジの表示が確認されたら、『保存』で確定します。
以上で完了です。動作などをチェックしてみましょう。
お疲れ様でした。
お問い合わせフォームでGmail等のエラーを解決
チョイじじお問い合わせフォームも出来てようやくちょっとしたブログサイトになってきましたね！！
メチャじじあれっと！ようやくお問合せフォームを設置してメールを送ってみたところメールが届かないとか、迷惑メール扱いになっている場合があるのじゃ・・・・、どういう事じゃ？？？
せっかくお問合せフォームを作ったのにこんなメールが・・・・
WordPressでお問合せフォームをGmailで設定・設置してメールが送信されると受け取り側では、迷惑メール扱いになることがあります。これはレンタルサーバー上から、プログラムによってメールを送っているからです。URLとサーバーのプログラムから送信する際のURLが異なっていることが、大きな原因だと言われています。
チョイじじということで、これを解決するためには、別のプラグインが必要になります。
ひろおじでは、そんなメールのお悩みをWP Mail SMTPというプラグインを入れて解決していきましょう。
メチャじじよ～し、もうひとふんばりじゃ、やるのじゃ～
WP Mail SMTPは無料のプラグインですが、導入後は最適化にしてメールを送信し、スパムフォルダーを回避し、メールが毎回受信者の受信トレイに確実に届くようにすることができます。
まとめ：SWELLでのお問い合わせフォームの設定
今回は、SWELLでのお問い合わせフォームの設定ついて、解説しました。
WEBサイトやブログを運営する上で、ユーザーと連絡が取れることは、思わぬクレームなどで大きなトラブルに発展しないために必要なことです。他にもメリットがたくさんありますが、逆にデメリットが存在しません。
ただ、お問い合わせフォームの設置はプログラム動作になるので初心者からすると難易度が高いと感じるかもしれません。そんなことから「後からやろう」「今度にしよう」と言ってるうちに機会を逃してしまっている方もいると思います。
今回設定したContact Form by WPFormsは、簡単に設置できますので、そういった不安のある方もトライしてみてくださいね！
具体的な、ダウンロードや設定方法、スパム対策はこちらをご覧ください。
- お問い合わせフォームの必要性
- お問い合わせフォームは、ユーザーにもWEBサイトにも便利
- SWELLでオススメのお問い合わせフォーム
- Contact Form by WPFormsのインストール｜SWELL
- Contact Form by WPFormsの導入・設定
- Google reCAPTCHAの登録、設定方法【スパム対策】
- お問い合わせフォームでGmail等のエラーを解決
本記事を読めば、SWELLのブログサイトに「お問い合わせフォーム」の設置・設定ができるようになります。お問い合わせフォームがあることで、ユーザーには、安心感・信頼感につなげることができ、万が一の場合の連絡先の確保ができるようになります。特にアフィリエイトに挑戦される方は必須となりますので、是非参考にしてくださいね。
ピックアップバナーはブログサイトの重要な位置にある
また「SWELLでのお問い合わせフォームの設定」が終わりましたら、次は「Googleアナリティクスの登録、設定方法」にチャレンジしてみましょう。
詳しいやり方は下記の記事で紹介しているので、あわせて読んでみてくださいね。
当ブログでは、初心者が快適なブログ運営をするために必要な『エックスサーバー』と『SWELL』の説明。そしてWordPress導入後、10記事書くまでに必要なWordPressとSWELLの設定、必要なプラグイン等の徹底解説をしております。ぜひご活用くださいませ！