育休中のママに絶対伝えたいこと ≫

Wordpresブログにお問い合わせフォームの作る方法【超初心者向け】

こんな「知りたい」を解決できる記事を用意しました!

この記事で紹介する「Wordpresブログのお問い合わせフォームの作り方」を見れば、20~30分あればあなたのブログにお問い合わせフォームを設置することができます。

なぜなら、難しいことが嫌いなITオンチの私でも記事の通りに進めたら、無事に「お問い合わせフォーム」を作ることができたからです!

あこ

すごく簡単に作れるので安心してください!

この記事を読みながら進めていってくださいね。

ささ、いきましょう!

目次

お問い合わせフォームの作り方5ステップ

それでは、さっそくお問い合わせフォームを作成していきましょう。

今回はWordPressでお問い合わせフォームをカンタンに作れる「Contact Form 7」を利用し、フォームを作成する方法を紹介しますね!

Contact Form 7はほとんどのブロガーが活用している定番プラグインなので安心して利用できますよ。

Contact Form 7を使ったお問い合わせフォームの作り方

お問い合わせフォームを作るためには下記の流れで進めていきましょう。

お問い合わせフォームを作る流れ
  • Contact Form 7について理解する
  • プラグインのインストール/有効化
  • Contact Form 7の設定
  • 固定ページにショートコードを埋め込む
  • スパム対策をする(reCAPTCHA)

一つずつ解説していきますね。

1.Contact Form 7って何?

Contact Form7は、Wordpresのプラグインの一つでカンタンにお問い合わせフォームを作ることができるものです!

安心してください、無料です!(よかった~)

基本設定をしてショートコードを固定ページにコピペするだけなので、HTMLやCSSといった専門知識がなくてもカンタンにお問い合わせフォームが作れますよ!

2.プラグインのインストール/有効化

まずは、プラグインのインストールと有効化をしていきましょう。

プラグインのインストール/有効化の画像

STEP
左側メニューバー「プラグイン」→「新規追加」をクリック
STEP
「プラグインを追加」画面の右上部「プラグインの検索…」部分に『Contact Form 7』と入力
STEP
プラグインを見つけたら「今すぐインストール」をクリック

インストール後は、「今すぐインストール」→「有効化」に変わります

「有効化」されていることを確認しましょう。

3.Contact Form 7の設定

STEP
左側メニューバー「お問い合わせ」→「新規追加」をクリック

コンタクトフォームの作成画面が表示されたら、タイトルを入力しましょう

タイトルは外部公開されませんので、自分が分かりやすい名前をつけてOK
(ちなみに私は「コンタクトフォーム」にしてます)

Contact Form 7の設定②画像

タブを押すと各項目が設定登録できるのでやってみましょう。

各項目の設定方法を説明していきますね!

3.1.フォーム

お問い合わせフォームの表示される内容を設定します。

基本的にはデフォルト設定のままでOKです!

もしもその他、お問い合わせをする相手から入力してほしい情報があれば、上のボタンを押してフォームを追加して好きにカスタマイズしましょう。

変更完了後、「保存」クリックを忘れずにしましょう。

 3.2.メール

メール

メールは、あなたとお問い合わせをした人それぞれにメールが届くように設定するものです。

お問い合わせした方には無事に送信されたことの「確認メール」が、あたなには「お問い合わせがありました」とお知らせが届きます。

お問い合わせフォームを作るうえで、ここの設定が一番大事です!

「メール」の設定

「メール」は問い合わせがあった際に、自分宛に届くメールのことを指します。

送信先お問い合わせを受け取りたいメールアドレス
送信元自動メールを送信するアドレス(このままでOK)
題名メールのタイトル
追加ヘッダー初期設定では問い合わせした方のメールアドレス入力先
メッセージ本文問い合わせの本文
ファイル添付 このままでOK
「メール(2)」の設定

「メール(2)」はお問い合わせしたユーザーに「きちんと受け付けましたよ!」と自動でお知らせメールが送られる機能です。

初期設定では「メール(2)」は設定されていません。
(「メール(2)を利用する」にチェックをすれば使えます)

あこ

きちんと問い合わせメールが送られたか確認できた方が安心できると思うので、私は設定することをオススメします。

送信先お問い合わせした方のメールアドレス(このままでOK)
送信元自動メールを送信するアドレス(このままでOK)
題名「お問い合わせありがとうございました」とかに変更してもOK
追加ヘッダー初期設定では問い合わせした方のメールアドレス入力先
メッセージ本文相手が入力した問い合わせの本文
ファイル添付何も入力しなくてOK

これでメールの設定は完了です!

3.3.メッセージ

メッセージ

メッセージでは、お問い合わせフォームで表示されるメッセージを変更できます。

初期設定のままでOKですが、好きなように変更できますよ。

メッセージを変更した場合は、画面下部の「保存」を忘れずにしましょう。

4.固定ページにショートコードを埋め込む

固定ページにショートコードを埋め込む

設定を保存すると、コンタクトフォームの一覧画面に「ショートコード」が表示されます。「ショートコード」は後ほど固定ページに貼り付けますので、メモ帳などにコピペしておきましょう。

固定ページの新規追加

STEP
左側メニューバー「固定ページ」の中の「新規追加」をクリック
STEP
ブロックエディタを開いたら、ブロックを追加

「ウィジェット」より「ショートコード」を選択

STEP
ショートコードを貼り付ける

ショートコードを入力する画面が表示されたら、先ほどコピーしたショートコードを貼り付ける

ショートコードを貼り付ける

ショートコードの入力画面が表示されたら、先ほどコピーしたショートコードを貼り付けます。

お問い合わせフォームが表示されればOK

最後にお問い合わせページにアクセスして、フォームが表示されていれば完了です!

あこ

とりあえずお問い合わせフォームは完成しました!
(あともう少しで終わります)

5.スパム対策をする(reCAPTCHA)

ブログのアクセス数が増えてくるとお問い合わせフォームから、まれにスパムが届くことがあります。

スパムとは

「スパム」とは受け取り手が望んでいない、要求していない通信を大量に送信することをいいます。一般的な形式は電子メールですが、最近では、Twitter、Instagram、FacebookといったSNSのメッセージを使ったものや、ソーシャルメディア、ボイスメールなどで送られてくるスパムも増えてきています。また、ウェブ上の迷惑行為そのものを「スパム」と呼ぶこともあるようです。

NECフィールディング」より引用 

お問い合わせフォームからスパムを送ってくることもあるので、必ずスパム対策しておいたほうがいいでしょう。

では、スパム対策とはどんなことをすればいいのか。

それは「reCAPTCHA」というGoogleが無料で提供しているツールがあるのでそれを使いましょう。

あこ

このサイトにも「reCAPTCHA」が使用されています。

「Google reCAPTCHA」の使い方

reCAPTCHAの設定方法をご紹介していきますね。

STEP
「Google reCAPTCHA」サイトにアクセス

reCAPTCHAを利用する際、Googleアカウントが必要

STEP
サイト右上の「Admin Console」をクリック
STEP
画面の通りにブログ情報を入力していく

間違いがないことを確認し、「送信」をクリック

後で「サイトキー」と「シークレットキー」が必要になるのでメモ帳などにコピペ推奨

STEP
WordPressの管理画面に戻って、「お問い合わせ」➡「インテグレーション」をクリック

「他のサービスとのインテグレーション」の画面が表示されたらreCAPTCHAにある「インテグレーションのセットアップ」をクリック

STEP
「サイトキー」「シークレットキー」を入力する

先ほどメモしたものをそのまま入力する

STEP
「変更を保存」をクリック➡完了です!

これで悪質なスパム対策はOK

あこ

「サイトキー」や「シークレットキー」をコピペすることを推奨しましたが、万が一『消えちゃった』『コピペ忘れちゃった』という場合は以下の方法で確認できますよ!

「サイトキー」と「シークレットキー」の確認方法

①「Google reCAPTCHA」にアクセス➡「Admin Console」を表示

②画面右上の歯車アイコンをクリック

③以前設定したreCAPTCHAの使用状況が表示される画面に移動

④画面右上の歯車アイコンをクリックします。

⑤「reCAPTCHAのキー」をクリック➡サイトキーとシークレットキーが表示されてます

「お問い合わせフォーム」リンクを追加する

今までやってきたことをおさらいしましょう。

・固定ページ(問い合わせフォームのページ)
・スパム対策(reCAPTCHA)

この2つができたら完成まであと少しです。

次は作成した固定ページ(問い合わせフォーム)をサイトに公開する準備をしましょう。

STEP
「外観」➡「メニュー」をクリック

左側のメニューバーの外観にカーソルを当ててメニューをクリック

STEP
メニュー画面「名前を入力」➡メニューを作成

名前は分かりやすいものでOK!

あこ

私は「トップメニュー」にしてます。

STEP
メニュー設定➡メニューの位置を決める

好きなところでOK!今回はトップメニューを選択

STEP
「メニュー項目を追加」➡固定ページ➡メニューに追加

「メニュー項目を追加」から追加したい固定ページ(お問い合わせ)にチェックを入れ、「メニューに追加」をクリック

STEP
「メニューを保存」をクリック
STEP
自身のサイトを見て「お問い合わせフォーム」があるか確認

指定した場所に表示されているかを確認する

使用しているテーマによって表示位置が異なるので、表示される場所をレビューで確認しながら設定してみてくださいね。

STEP
これで完了!…だけど問い合わせが届くか確認をしよう

お問い合わせフォームから自分で適当に文字を入れてきちんと自分のメールにお問い合わせが届くか確認をしましょう(大事)

無事に自分が送った問い合わせメールが届いたか動作確認ができたら「お問い合わせフォームの」設置はこれですべて完了です!

あこ

これでブロガーとして一つ大事なお仕事が終わりましたね。
お疲れ様です!

ブログにお問い合わせ先を掲載した方がいいの?

「お問い合わせフォームがあるといいって聞いた」
「ブロガーさんから作った方がいいと言われた」
「Googleアドセンス合格したいから」

とりあえずブログに問い合わせフォームを設置したものの、

「そもそもブログに問い合わせって来るの?」
「どうしてブログにお問い合わせ先を設置する必要ってあるの?」

と疑問に思われている方もいると思います。

あこ

正直にいうと私はブログを開設して3年間、お問い合わせフォームから連絡があったことはありませんでした(笑)

で!す!が!
結論お問い合わせフォームは、めちゃめちゃ必要です(した)!

ブログにお問い合わせ先が必要な理由を解説しますね。

お問い合わせ先が必要な理由4つ

ブログサイトにお問い合わせ先を入れる必要があるのは、以下4つの理由があるからです。

お問い合わせ先が必要な理由
  1. もしもの時の連絡窓口になる
  2. Googleアドセンスなどの審査に通りやすくなる
  3. 企業から直接仕事の依頼を受けることがある
  4. サイトの信頼感のアップにつながる

順番に解説しますね。

1.もしも時の連絡窓口になる

お問い合わせ先が必要な一番の理由は、もしもサイトに何か問題があった時に第三者がブログ管理者と連絡を取るツールが必要があるからです。

問い合わせ例

・記事の内容に間違いがある
・記事の内容が古くて勘違いする人がいる
・記事の内容が名誉棄損にあたる

万が一、このような事態が起きれば素早く訂正・修正しなければいけません。

大きなトラブルに発展させないためにも、お問い合わせ先を明記しておく必要があります。

2.Googleアドセンスなどの審査に通りやすくなる

先ほどチラッとお話しましたがGoogleアドセンスをはじめ、一部のASPに申請をする際、お問い合わせ先をを用意することで審査に通りやすくなります。

あこ

ブログで広告収入を得たいと思っているならば、お問い合わせ窓口を用意することは必須です。

3.企業から仕事のオファーをもらえることがある

ブログを運営していると、まれに企業から直接仕事の依頼を受けることがあります。

企業からのオファー例
  • 執筆依頼
  • インタビュー
  • 依頼メディア出演依頼
  • 純広告(直接契約)の掲載依頼
  • 商品・サービスのレビュー依頼

「このサイト分かりやすくて良いな。よし、この人に仕事の依頼をしよう!」

と思っていただけても、問い合わせ先が表記されていなければ、オファーすることを諦めてしまいますよね。

せっかくの大チャンスを逃すことになるので、お問い合わせ窓口は必ず用意しておきましょう。

4.ブログの信頼感・安心感のアップにつながる

ブログに問い合わせ窓口があると、読み手に「困ったことがあればサイトの運営者(あなた)と連絡が取れる」と安心感を与えることができます。

運営者情報やお問い合わせフォームのないサイトは「一体誰が運営しているんだろう?」と信頼していいのか不安です。

お問い合わせ先を用意するだけでも「ちゃんとしたサイトなんだな」と読者に信用してもらえるのでフォームの設置は必須ですね。

連絡先を公開する手段は何がいいの?

おすすめはSNSアカウント(DM)とお問い合わせフォームの2つを設置することですね。

SNSアカウントのメリットは、「お問い合わせフォームだとちょっと問合せしずらいな」と思う個人ユーザー層のハードルが下がるからです。

あこ

私に何か連絡を取ろうと思った際、「お問い合わせフォーム」と「SNS(DM)」とだったらDMの方が気楽じゃないですか?

しかしSNS(DM)しか連絡手段がないのは危険です。

なぜならSNSを使っていないユーザーからは連絡の取りようがないからです。

じゃあメールアドレスを載せれば?と思うかもしれませんが、インターネット上にメールアドレスを公開すると大量のスパムメールがくる恐れがあります。

もちろんお問い合わせフォームからでもスパムがくる可能性はありますが、先ほど設定したreCAPTCHAを使うと迷惑メールがくる可能性はグンと下がります。

ブログを見てくれた読者(ユーザー)や企業の方が連絡しやすい窓口を設けるのは大事なのでSNSアカウントの公開&お問い合わせフォームの設置はマストですね!

まとめ

今回の記事では、WordPress内でお問い合わせページを作る方法と、お問い合わせフォームを導入するべき理由について紹介しました。

ではもう一度、お問い合わせフォームを作る流れをおさらいしてみましょう。

お問い合わせフォームを作る流れ
  • Contact Form 7について理解する
  • プラグインのインストール/有効化
  • Contact Form 7の設定
  • 固定ページにショートコードを埋め込む
  • スパム対策をする(reCAPTCHA)

ブログサイトにお問い合わせ先を載せるべき理由はこの4つ。

お問い合わせ先が必要な理由
  1. もしもの時の連絡窓口になる
  2. Googleアドセンスなどの審査に通りやすくなる
  3. 企業から直接仕事の依頼を受けることがある
  4. サイトの信頼感のアップにつながる

「お問い合わせフォーム」は、ほぼほぼ使わないです。

しかしあなたと連絡を取るために大事なパイプ的役目があります!

見ながらやればすぐに設置できるので、ぜひこれを機会にやってみてくださいね。

最後までお読みいただきありがとうございました!

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
目次