【10分でできる】WordPressでお問い合わせフォームの作り方【Contact Form 7】

【10分でできる】WordPressでお問い合わせフォームの作り方【Contact Form 7】

最近WordPressでブログ始めたのですが、お問い合わせフォームを設置しようと思っています。けどどうやって作るのかな・・・具体的に教えてください!

こんな疑問にお答えします。

この記事を読んでわかること
  • お問い合わせを設置すべき理由
  • お問い合わせフォームの作り方
  • お問い合わせフォームの設置方法

今回は、WordPressでのお問い合わせフォームの作り方を解説します。

そもそも、お問い合わせフォームってどういう時に役立つの?

お問い合わせフォームは、読者からのお問合せだったり、企業からアフィリエイト案件の掲載依頼が来たりする連絡手段です。

簡単に言えば、TwitterのDMみたいなものです。

Contact Form 7というプラグインを使えば、こんな感じに仕上がりますよ!当ブログのお問い合わせフォームです。↓

お問い合わせフォーム

お問い合わせフォームは、無料で簡単に作れるので本記事を読みながら設置しておきましょう!

今すぐにお問い合わせフォームを作りたい方は、下記のボタンをクリックしてください!(該当箇所に飛びます)

目次

お問い合わせフォームを設置する理由

まず最初に、お問い合わせフォームを設置する理由をお伝えしていきます。

  • プライバシー面で安心できる
  • 連絡先としても使える

それぞれ深掘りしていきます。

プライバシー面で安心できるから

お問い合わせフォームを設置すれば、プライバシーを守れます。

どうしてお問い合わせフォームを設置すれば、プライバシーを守れるの?

なぜなら、メールアドレスをサイトに公開しなくてよくなるからです。

仮にメールアドレスをサイトに公開しておくと、スパムメールが届いてしまいます。

だからお問い合わせフォームを設置すれば、プライバシーを守れるのです。

また、今回紹介するお問い合わせフォームには、スパム防止の機能もあるので対策バッチリです!

連絡先として使えるから

お問い合わせフォームを設置すれば、お問い合わせフォームがサイト運営者への連絡先になります。

わかりやすく言えば、InstagramやTwitterのDM機能みたいな感じです。

読者からのお問合せだったり、企業からアフィリエイト案件の掲載依頼が来たりもします。

そもそも、サイト運営者に連絡できるフォームがないと、なんか少し怪しい感じがしますよね。

そのため、お問い合わせフォームは設置しておきましょう。

WordPressでお問い合わせフォームの作り方【Contact Form 7】

お問い合わせフォームを設置する理由がわかったところで、実際にお問い合わせフォームを作ってきましょう。

WordPressブログでお問い合わせフォームを設置するには、下記の2種類の方法が便利です。

  • Contact Form 7を使う
  • Google フォームを使う

この記事では、設置が簡単で無料の「Contact Form 7を使った方法」を解説していきます。

10分もかかりませんのでサクッと進めていきましょう!

手順①:プラグインをインストール

ます最初に、「Contact Form 7」をインストールしましょう。

下記の流れでインストールしましょう。

  1. 管理画面
  2. プラグインを追加を選択
  3. 検索窓から「Contact Form 7」と検索
  4. 今すぐインストールをクリック
  5. インストールが完了したら、「有効化」をクリック

インストールから有効化まではとっても簡単です。

手順②:お問い合わせフォームを作成

ここからは、画像を使ってお問い合わせフォームを作成する手順を解説していきます。

管理画面の「お問い合わせ」に行き、「コンタクトフォーム1」をクリックしてください。

  • 「お問い合わせ」のボタンがない方は、「有効化」ができてないため、管理画面→プラグイン→インストール済みをプラグイン→contact form 7の有効化をクリックしてください。

クリックしたら、お問い合わせフォームの編集画面が出てきます。

フォーム設定

お問合せ付フォームに搭載するべき項目は4つです。

  • お名前
  • メールアドレス
  • 題名
  • メッセージ本文

お問い合わせの件数を増やしたい方は、項目は少ない方が有利です。

項目が多いと、打つのも面倒ですよね。そう言った意味で項目は少なくしておきましょう。

当ブログのお問い合わせフォームは元から設定してある項目のまま、お問い合わせフォームを作成しています。

メール設定

続いて、メールの設定をしていきましょう。

メール設定で確認すべき項目は以下の4つです。

メール設定で確認すべき項目4つ

①送信先:
WordPressに登録してある、管理者メールアドレス宛に送るという意味です。
※「管理画面」→「設定」→「管理者メールアドレス」で変更可能

②送信元:
wordpress@サイト名のアドレスから、お問い合わせメールが送られてくるという意味です。

③題名:
サイト名 + お問い合わせに記載してある題名がメールの題名になります。

④追加ヘッダー:
CC:やBCC:で送りたいメールアドレスを追加できます。

⑤メッセージ本文:
お問い合わせメールの内容を設定できます。変更しなくてOKです。

基本は何もいじらなくてOKです。

メッセージ設定

次は、メッセージ設定をしていきます。

デフォルトでは上記のような文言が設定されています。

お好みの文言に設定しておきましょう。

その他の設定

その他の設定では、ログインしているユーザーだけがお問い合わせフォームを送ることができる「購読者限定モード」なども利用可能です。

詳しくは、Contact Form 7公式サイトの「その他の設定」をみてください。

スパム対策をする方法

Contact Form 7でスパム対策をするなら「reCAPTCHA」というプラグインをインストールしましょう。

設定方法は下記の記事をご覧ください。詳しく解説しています。

記事

これで「Contact Form 7」の設定は完了です。

最後に「保存」をクリックするのを忘れないようにしましょう。

手順③:お問い合わせフォーム設置

次は、お問い合わせフォームを設置していきましょう。

「コンタクトフォーム 1」の下にある、ショートコードをコピーして、お問い合わせ用のページへ貼り付けます。

上記の写真の青い部分をコピーしておきましょう。

今回は、以下の3つの場所にお問い合わせフォームを設置する方法を教えていきます。

  • 固定ページに設置
  • グローバルナビゲーションに設置
  • サイドバー・フッター

順番に解説していきます。

固定ページに設置

管理画面」→「固定ページ」→「新規作成」で新しい固定ページを作成して、先ほどのショートコードを貼りつけましょう。

上記のような感じになればOKです。文字だけになっていてもOKです。

WordPressのエディターがグーテンベルクの場合は、「カスタムHTML」というブロックに貼りつけましょう。

プレビューで見てみると、しっかり反映できていますよ。

✔︎お問い合わせフォーム完成

実際にテストメールを送ってみましょう。

自分が登録したらメールアドレスにお問い合わせメールが届いてれば、OKです。

お問い合わせメール届かなかったよ・・・

こんな時は、

  • メール受信設定で受信拒否していないか? 
  • 登録したメールアドレスはあっているか?

を確認してみましょう。

管理画面」→「設定」→「一般」→「管理者メールアドレス」で変更可能です。

✔︎実際に届いたメール

上記のようにメールが届きました。

グローバルナビゲーションに設置

グローバルナビゲーションいわゆるヘッダーに設置していきましょう。

当ブログでも、上記の場所に「お問い合わせフォーム」を設置しています。

管理画面」→「外観」→「メニュー」をクリックして、グローバルナビゲーション(大抵はヘッダー)をクリックしましょう。

次のような手順で設置していきましょう。

左側にある「メニュー項目を追加」→「固定ページ」→「お問い合わせ(作成したページ)」をチェックして、「メニューに追加」をクリックしましょう。

すると、右側に「お問い合わせフォーム」の項目がつかされていれば設置完了です。

最後に「メニューを保存」をクリックしましょう。

サイドバー・フッターに設置

次は、サイドバー・フッターに設置する方法を紹介します。

「外観」→「ウィジェット」をクリックしてください。

ウィジェットにアクセスできたら、左側から「テキスト」をクリックして「共通サイドバー」をタップして「ウィジェットに追加」をクリックしてください。

追加ができたらショートコードを直接貼りつけます。

できたら「保存」を押しましょう。

すると、下記のようにダイレクトにお問い合わせフォームを設置できました。

フッターウィジェットに貼り付ければ、フッターに表示することもできます。

まとめ

以上がお問い合わせフォームの作り方でした〜!

WordPressブログを設置した方は、お問い合わせフォームを設置しておきましょう!

  • プライバシー面で安心できる
  • 連絡先としても使える

上記のような面でとても役に立ちますよ!

有名になってくると、企業から案件が来たりも夢じゃないですね✴︎

設置方法は紹介した通りにすれば簡単だったと思います。

これから設置しようと思っている方も本記事の手順通りで設置してみてください!

今回はこの辺で終わります!ありがとうございました1

目次