ネット関係

WordPressお問い合わせフォーム作成【Contact Form 7設定】

Contact Form 7

ブログを作る上でお問い合わせフォームは必ず必要です。お問い合わせフォームを設置すると、ブログからメッセージが来たり、何か仕事のオファーを頂くこともあります。

お問い合わせフォームがあると、読者の方にもより信頼してもらえるので早めに設置しておきましょう。

WordPressでは、「Contact Form 7」というプラグインがおすすめです。このプラグインを使用すれば簡単にお問い合わせフォームを設置することができますよ。

今回は「Contact Form 7」のインストール、設定方法を解説していきます。

Contact Form 7のインストール方法

Contact Form 7

まずはWordPressにContact Form 7のプラグインをインストールして有効化します。

WordPressプラグインのインストール方法がわからない方はこちらの記事をご参照ください。
▶︎ WordPressプラグイン2つのインストール方法とは【初心者向け】

Contact Form 7の設定

Contact Form 7のインストールと有効化ができたら、お問い合わせフォームの内容をプラグインで作成します。

「プラグイン」→「設定」をクリックします。

Contact Form 7

「コンタクトフォーム1」をクリックします。

Contact Form 7

フォーム設定

お問い合わせフォームの内容について細かい設定をします。

Contact Form 7
①ここは読者に見られる場所ではないので、自分でお問い合わせのパーツとわかるように設定してください。(私はこのまま「コンタクトフォーム1」にしています。)

②お問い合わせの項目です。(ここで設定したものがこのように表示されます。)

Contact Form 7

 

デフォルトのままでも大丈夫であればこのままでOK。もし他に付け加えたい項目があればフォームの下のボタンを押して自分の条件に合うように設定してタグを作成してください。

普通のブログであれば、このままデフォルトの状態で大丈夫です。設定が終わったら「保存」をクリックします。

メール設定

Contact Form 7

①送信先:自分がお問い合わせを受け取るメールを設定します。
②送信元:これはどこから送られたか表示するもの、このままでOK。
③題名:自分が受信した時のメールの題名、デフォルトのブログ名だけではわかりづらいので、お問い合わせに変更するのがおすすめです。
④追加ヘッダー:受け取るメールの返信先を指定する。デフォルトでOKです。
⑤メッセージ本文:本文の内容を設定しますが、自分でこだわりがなければこのままでOKです。

設定が終わったら「保存」をクリックします。

Contact Form 7

自動返信メールの設定方法についてはこちらの記事で詳しく解説していますのでご参照ください。

▶︎ Contact Form 7自動返信メールの作成&設定方法

メッセージ

お問い合わせフォームで使われるメッセージの内容一覧です。変更したい場所があれば変更します。

Contact Form 7

その他の設定

ここは、Google Analyticsのアクセス解析ツールでお問い合わせページを見た人が、実際にどれだけお問い合わせがあったかなどを計測するコードなどを設置したりするときに使います。

初期設定ではここは空白でOKです。

Contact Form 7

 

お問い合わせフォームページを作成する方法

Contact Form 7でお問い合わせフォームの内容を作成したので、WordPressの固定ページでお問い合わせのページを作成します。

「固定ページ」→「新規追加」をクリックします。

Contact Form 7

ページタイトルには「お問い合わせ」などわかりやすいものを入れて、先程コピーしたショートコードを記事部分に貼り付けます。そして「公開」をクリックします。

Contact Form 7

するとこのようなページが出来上がります。

Contact Form 7

固定ページにお問い合わせフォームが作成できたら、まだこの段階ではブログに表示されていない状態なので、テンプレートに合わせて好きな場所にお問い合わせページを表示してください。

私は「外観」→「メニュー」ページで左側にある固定ページを右側のメニュー構造に追加して、メニューバーをヘッダー下部分に表示させるように設定して「保存」でお問い合わせがブログに表示されるようになっています。

Contact Form 7

最後にお問い合わせフォームが作動するか確認しておきます。内容を入力して「送信」をクリックします。

Contact Form 7

メールを確認すると、このように届いております。

Contact Form 7

これでお問い合わせフォームが設置できました。お疲れ様です!