WordPressにお問い合わせフォームを設置する方法 （Contact Form 7）

概要

WordPressでお問い合わせフォームを設置する場合、プラグインを使う方法が最も簡単で一般的です。

今回は定番プラグインであるContact Form 7公式サイトを使った設置方法をご紹介します。

Contact Form 7とは

Contact Form 7は、WordPressで簡単にお問い合わせフォームを作成できるプラグインです。

主な特徴は以下の通りです。

・無料で利用可能
・シンプルで軽量
・カスタマイズしやすい

多くのサイトで使われており、初めての方にもおすすめです。

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

管理画面から以下の手順でインストールします。

「プラグイン」→「新規追加」
「Contact Form 7」で検索
インストール → 有効化

手順②：フォームを作成

管理画面に「お問い合わせ」メニューが追加されるのでクリックします。

デフォルトでフォームが1つ作成されています。

フォーム例

 お名前

  [text* your-name]


 メールアドレス

  [email* your-email]


 お問い合わせ内容

  [textarea your-message]


[submit "送信"]

手順③：ショートコードをコピー

フォーム編集画面の上に表示されているショートコードをコピーします。

手順④：固定ページに貼り付け

お問い合わせページに貼り付けます。

ショートコード例

[contact-form-7 id="123" title="お問い合わせ"]

手順⑤：CSSでデザインを整える

見た目を整えたい場合はCSSで調整します。

CSS例

.wpcf7 input,

.wpcf7 textarea {

  width: 100%;

  padding: 10px;

  margin-bottom: 10px;

}

.wpcf7 input[type="submit"] {

  background: #333;

  color: #fff;

  border: none;

  padding: 10px 20px;

}

解説

Contact Form 7はショートコードで設置できるため、専門的な知識がなくても簡単に導入できます。

また、HTMLに近い記述でフォームを編集できるため、カスタマイズもしやすいのが特徴です。

まとめ

・お問い合わせフォームはプラグインで簡単に作成できる
・Contact Form 7は定番で使いやすい
・ショートコードでどのページにも設置可能

初めてフォームを設置する場合にもおすすめですので、ぜひ活用してみてください。

補足（おすすめ）

迷惑メール対策として、Google reCAPTCHAの導入も検討すると安心です。