WordPress最適化

「Contact Form 7」お問い合わせフォームの設置方法

5W1Hの画像

 

こんにちは。
必死に張り切る ひしはり です。

 

ひしはり
ひしはり
ブログにお問い合わせフォームを設置したいんだけど
どうすればいいの?

ブログ初心者でもかんたんにできるの?

本記事では
このような疑問にお答えします。

 

本記事の内容

❶ 「Contact Form 7」お問い合わせフォームの設置方法

❷ 「Contact Form 7」お問い合わせフォームの基本設定

❸ 「Contact Form 7」お問い合わせメールの設定方法

 

「アフィリエイト」などの
ネットビジネスを行う前提で
「WordPress」でサイトやブログを
運営して行くのなら、
「お問い合わせフォーム」
ページに設置するのは、
必須だといえます。

では「WordPress」で運営している
自分のサイトやブログに
「お問い合わせフォーム」
設置したいときには
どうしたらいいのでしょうか?

「お問い合わせフォーム」
サイトやブログに設置となると、
通常は専門的なWebの知識が
必要となります。

しかし、今日ご紹介する
「WordPress」プラグイン
「Contact Form 7」
導入すれば、初心者の方でも
かんたんにサイトやブログに
「お問い合わせフォーム」
設置することが
できるようになります。

本記事を読めば、
そんな「Contact Form 7」
設置方法がわかり、
ブログ初心者でもかんたんに
ブログに「お問い合わせフォーム」
設置することができますよ!

読者から寄せられる
貴重な意見やコメントを
「お問い合わせフォーム」
設置することで、
しっかりと受け取れるように
しておきましょう!

 

この記事を書いている人

この記事を書いている私はブログ歴4年目

現在は本業のサラリーマンの傍ら副業ブロガーとして活動しています。

Twitter(ひしはり人生再構築ブロガー)のフォロワーは1800人ほど。

「Contact Form 7」お問い合わせフォームの設置方法

お問い合わせの画像

 

それではさっそく
「Contact Form 7」
インストールして
ブログに設置する方法を
わかりやすく画像付きで
ご紹介して行きたいと思います。

「Contact Form 7」のインストールと有効化

 

まずは「WordPress」
管理画面の左メニューから
「プラグイン」「新規追加」
クリックします。

 

Contact Form 7の設定の画像

 

右上にある「検索フォーム」
「Contact Form 7」
入力して検索し、
「今すぐインストール」
「有効化」をクリックします。

 

Contact Form 7の設定の画像

 

「Contact Form 7」
有効化すると「WordPress」
管理画面の左メニューに
「お問い合わせ」の項目が
追加されます。

 

Contact Form 7の設定の画像

 

これで「Contact Form 7 」
インストールは完了しましたので、
続いてブログ内に
「お問い合わせフォーム」
作成して行きます。

「お問い合わせフォーム」の作成方法

 

まずは「WordPress」
管理画面の左メニューに
追加された
「お問い合わせ」の項目から
「コンタクトフォーム」
クリックします。

 

Contact Form 7の設定の画像

 

次に「コンタクトフォーム1」
表示されている
コードをコピーします。

 

Contact Form 7の設定の画像

 

コピーしたそのコードを
これから作成する
「お問い合わせ用の固定ページ」
貼りつける必要があるため、
「お問い合わせ用の固定ページ」
作成して行きます。

「WordPress」
管理画面の左メニューから、
「固定ページ」「新規追加」
クリックします。

 

Contact Form 7の設定の画像

 

「新規固定ページ」
作成画面に移動したら、
タイトル欄にタイトル
(私の場合は「お問い合わせ」)を
入力して次に記事URLである
「パーマリンク」
入力(編集)します。

パーマリンクは基本的に
英数字の小文字
わかりやすい構成に
しておきます。

私の場合は
「https://hishihari.com/otoiawase/」
となっています。

次に「テキスト」をクリックして
「テキストモード」に切り替えて
先ほどコピーしたコードを
テキスト内に貼りつけます。

 

Contact Form 7の設定の画像

 

コードを貼りつけたら、
画面右上の「公開」ボタンを
クリックして
固定ページを公開します。

「お問い合わせフォーム」をグローバルメニューに表示

 

次に作成した「お問い合わせフォーム」
「グローバルメニュー
(ナビゲーションメニュー)」
表示させたいときは、
「WordPress」の管理画面の
左メニューから
「外観」「メニュー」
クリックして固定ページ項目内の
「お問い合わせ」にチェックして
「メニューに追加」をクリックします。

 

Contact Form 7の設定の画像

 

Contact Form 7の設定の画像

 

メニュー項目内に
「お問い合わせ」が、
追加されますので、
「メニューを保存」
クリックして完了となります。

 

Contact Form 7の設定の画像

 

以上で「お問い合わせフォーム」
作成と設置は完了です。

続いて「Contact Form 7」
基本設定を行なっていきます。

「Contact Form 7」の基本設定

設定の画像

 

「Contact Form 7」
ブログに導入して使用して行く上で
以下の基本設定は必要なことですので、
必ず設定しておきましょう。

まずは「WordPress」
管理画面の左メニューから
「お問い合わせ」
「コンタクトフォーム」
「コンタクトフォーム1」の順に
クリックして進んで行きます。

 

Contact Form 7の設定の画像

 

 

ここでは
「お問い合わせフォーム」内に
表示したい項目を
変更したり追加したり
することができます。

コードをコピーして
貼りつけた段階で
フォームの項目内容は、
デフォルトですでに
表示されるようになっています。

 

Contact Form 7の設定の画像

 

タイトルは自由に変更できますので、
複数の「お問い合わせフォーム」
作成したときに区別がつきやすいように
しておくことができます。

また、すでに表示されている
デフォルトのフォームの項目内容を
赤枠で囲った各項目から
追加することもできます。

 

Contact Form 7の設定の画像

 

項目を追加したい場合は、
その項目を選択して
「タグを挿入」をクリックすると
タグがテキスト内に表示されます。

このタグがテキスト内に
表示されただけでは、
正しく「お問い合わせフォーム」
反映されませんので、
このタグに少し手を加えます。

テキスト内に表示されたタグを
「<label>項目名とタグ</label>」
形に編集します。

たとえば「日付」を追加したい場合、
選択して「タグを挿入」
クリックすると、
私のブログの場合は、
テキスト内に [date date-511]</span>
というタグが表示されます。

 

Contact Form 7の設定の画像

 

Contact Form 7の設定の画像

 

Contact Form 7の設定の画像

 

そのタグをテキスト内で
「<label>日付 [date date-511]</label>」
といった形に編集し直します。

 

Contact Form 7の設定の画像

 

編集し直したら
画面下にある「保存」
クリックすれば追加設定が
完了となります。

以上の要領で追加したい項目を
増やして行ったり表示順を
変更したりすることができます。

「Contact Form 7」お問い合わせメールの設定方法

パソコンとメールの画像

 

ここではブログの読者から、
「お問い合わせ」があったときに
自分宛と送信者宛に
自動で送られるメールの
設定をすることができます。

 

Contact Form 7の設定の画像 Contact Form 7の設定の画像

 

送信先自分が受信に使うメールアドレス
送信元送信者の名前(ハンドルネーム)が表示
題名送信者が題名に入力したものが表示
追加ヘッダー特に必要ありません
メッセージ本文送信者がメッセージ本文に入力したものが表示

 

送信者宛のメッセージ本文には、
一番上に「お問い合わせ」
もらったことへのかんたんな挨拶や
返答までにかかる日数などを
入力しておくと
相手に対して丁寧な好印象を
与えることができるかと思います。

 

Contact Form 7の設定の画像Contact Form 7の設定の画像

 

送信先送信者のアドレス
送信元ブログのドメイン
題名自分が入力したタイトル名が表示
追加ヘッダー特に必要ありません
メッセージ本文送信者がメッセージ本文に入力したものが表示

 

設定が完了したら、
画面下にある「保存」
クリックして「Contact Form 7」
基本設定は完了となります。

まとめ

 

「お問い合わせフォーム」は、
読者がすぐに見つけられるように
ブログ内のわかりやすい場所に
設置するようにしましょう。

読者がどこから
「お問い合わせ」をしたらいいかと
迷ってしまうような
フォームの設置の仕方では、
とてもユーザビリティに優れた
ブログとはいえません。

今回の記事では、
「WordPress」で運営する
サイトやブログで
初心者でもかんたんに
「お問い合わせフォーム」
設置できる「WordPress」プラグイン
「Contact Form 7」
設置方法と基本設定について
ご紹介しました。

ぜひ、参考にしてもらえればと思います。

いついかなるときも、
読者にとっての最善を尽くしたいと
必死に張り切る ひしはり でした。
今日は、ここまで。

関連記事