【WordPress】お問い合わせフォームの簡単設置方法を画像解説

ワードプレスのロゴマークと記事タイトル画像ワードプレス
スポンサーリンク

こんにちわ。

りゅうまるです。

 

この記事では、ワードプレスにお問い合わせフォームを設置する方法(手順)を、画像解説していきたいと思います。

 

ワードプレスにお問い合わせフォームを設置するには、Contact Form 7(コンタクトフォーム7)というプラグインを使ったやり方が最も簡単です。

 

今回は、シンプルでわかりやすいデフォルト設定のやり方で解説していきます。

お問い合わせフォーム設置の流れ

  1. 「Contact Form 7」をインストール(有効化)
  2. お問い合わせフォーム設定(デフォルトでOK)
  3. 固定ページにお問い合わせフォームを作成
  4. グローバルナビにフォームを反映(関連記事リンク)

 

お問い合わせフォームを作成したら、グローバルメニューなどにリンクを設置しないと機能しないので意味がないですよね。

 

Contact Form 7のインストールからグローバルメニューへの反映までを一気にやろうとすると、手順が多くなり把握しにくいと思うので、今回はお問い合わせフォームの設置までを解説していきます。

 

グローバルメニューをワードプレスに設置する方法もこの後作成し、この記事内にリンクを設置しておきますので、引き続き作業をされる方は参考にしてくださいね。

 

ちなみに、フォーム設置後のグローバルメニューの設置方法は、使用されているテーマによって手順が異なると思いますが、僕は無料テーマのCocoon(コクーン)を使用しているので、Cocoonでの解説になります。

 

ご了承くださいませ(__)

 

それではまず、お問い合わせフォームの設置方法を解説していきますね。

 

「Contact Form 7」をインストール(有効化)

ワードプレスのダッシュボード管理画面内のプラグインにカーソルを合わせ、新規追加をクリックします。

 

ワードプレスプラグインの新規追加画面

プラグインを追加という画面に変わるので、プラグイン検索窓にContact Form 7と入力します。

入力すると1~2秒でContact Form 7が表示(左上)されるので、その中の今すぐインストールをクリックします。入力後画面が変わらない場合はEnterキーをクリックしてみてください。

Contact Form 7プラグインのインストール画面

 

今すぐインストールをクリックすると、数秒でインスト―ル中から有効化に変わるので、そのまま有効化をクリックします。

 

Contact Form 7の有効化画面

 

有効化をクリックすると、ダッシュボード(左管理メニュー)内にお問い合わせという項目が追加されます。

 

これで「Contact Form 7」のインストールと有効化は完了です。

 

ワードプレス管理メニュー内にお問い合わせ項目が追加された画面

 

次にお問い合わせフォームの項目内容を設定していきますが、基本的な項目はデフォルトで設定されています。

 

今回は、固定ページを使用してお問い合わせページを作成するやり方ですが、固定ページ内にコード(ショートコード)を一行貼り付けるだけの簡単な作業でフォームが設置出来てしまいます。

 

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

  1. Contact form 7でショートコードをコピー
  2. ワードプレスで新規固定ページ追加
  3. 新規固定ページにショートコードを貼り付ける
  4. タイトル(ページ名)とパーマリンクを設定

 

項目内容の追加や文字列変更、自動返信メールなどの設定は後から自由にできます。

 

「Contact Form 7」のデフォルト設定(項目)

 

以下はフォーム内で入力する項目一覧です。通常の連絡手段で必要な項目は、すべてデフォルトで用意されています。

 

  •  お名前(必須項目)
  • メールアドレス(必須項目)
  • 題名
  • メッセージ本文
  • 送信ボタン
    (送信完了のメッセージ表示あり)
  • 必須項目未入力表示(送信不可)

お問い合わせフォーム設置用のコードをコピー

先ほどプラグイン有効化で追加された管理メニュー内のお問い合わせにカーソルを置くと、サブメニューが表示されます。

 

デフォルト設定の場合は、お問い合わせをクリックしてもサブメニュー内のコンタクトフォームをクリックしても同じコンタクトフォームの管理画面が表示されます。

 

Contact form 7の管理画面への移動画面

 

コンタクトフォーム(お問い合わせ)をクリックするとContact Form 7の管理画面に変わります。

 

管理画面内を少し下にスクロールし、ショートコードという文字の下のコードの上でワンクリックすると全選択(反転)できるので、右クリックでコピーしておいてください。

 

コピーしたショートコードを、今回は固定ページ内にペースト(貼り付け)するだけで、お問い合わせフォームが設置できます。
Contact form 7の管理画面でショートコードをコピー

 

Contact form 7の管理画面内での作業はこれで完了です。

 

お問い合わせフォームは投稿ページでも作成できますが、その場合、記事一覧や最近の投稿と混ざってユーザーの目に触れることになります。
不具合があるわけではないですが、あえてユーザーに届ける必要はないと思うので固定ページで作成しておきましょう。

 

固定ページにお問い合わせフォームを設置する手順

ショートコードをコピーしたら、ダッシュボード(左管理メニュー)内の固定ページにカーソルを置き、サブメニューから新規追加をクリックします。

 

ワードプレスの新規固定ページ作成画面

 

新規の固定ページが表示されたら、まずは先ほどコピーしておいたショートコードを固定ページに貼り付けます。

 

ショートコードを貼り付ける場所は、テキスト入力スペース(白紙の部分)です。

 

次にタイトル入力欄に「お問い合わせ」や「お問い合わせフォーム」など任意のページ名を入力します。(以下の画像では「お問い合わせフォーム」としています。

 

パーマリンクの設定は、通常の投稿ページと同じ要領で設定してください。

 

僕は、「お問い合わせフォーム」の英訳で、「nquiry-form」と設定しました。

 

シンプルに「お問い合わせ」の英訳なら「Contact us」となります。

 

パーマリンクは日本語でも設定できますが、英語表記のほうがよいという意見が圧倒的に多いように思います。

 

英訳なら、インストールなしで無料で使えるGoogle翻訳がおすすめです。

 

お問い合わせフォームの編集例

 

以上で「Contact Form 7」でのお問い合わせフォーム作成は完了です。

 

お疲れさまでした^^

 

お問い合わせフォームの確認方法

お問い合わせフォームの設置が完了したので、プレビュー画面で確認してみてください。

僕が今回の記事を作成しながら作成したお問い合わせフォームは、以下のように出来上がりました。特にこだわりがなければ、デフォルト仕様が使いやすくていいんじゃないでしょうか?

 

お問い合わせフォームのプレビュー画面
Contact Form 7の入力ミスの表示画面

お問い合わせメールの確認方法

お問い合わせフォームの設置が確認出来たら、プレビュー画面から実際にお問い合わせフォームを使用してみてください。

 

お問い合わせフォームからのメールは、ご利用のワードプレスをインストールするときに設定したメールアドレスに届きます。

 

ワードプレスに設定してあるメールフォーム画像

 

複数ブログを運用していて、設定したメールアドレスが思い出せないなどの場合は、ダッシュボード左管理メニューから設定項目内の一般をクリックします。

 

ワードプレスダッシュボード管理メニュー

 

一般をクリックすると、一般設定ページ内のメールアドレス項目で確認できます。

 

ワードプレスの一般設定画面

ワードプレスのお問い合わせフォーム設置のまとめ

サイト(ブログ)内にお問い合わせフォームを設置するメリットは、一般ユーザーや運営サイトに関心を持ってくれた企業側から管理者へ直接メッセージが送れるということですよね。

 

記事の感想やちょっとした質問ならコメントフォームからの方が気楽でいいかもしれないですが、例えば広告設置の依頼などは、やはりお問い合わせフォームから依頼するほうが、受け取る側としてもわかりやすいと思います。

 

運営者側の実質的なメリットとしては、アドセンス申請時やASP、Amazonアソシエイト申請時に役立つという意見も多くありますが、それも信頼性というところが大きな基準になっているんでしょうね。

 

今回は、このブログではないですが別運用のワードプレスブログにお問い合わせフォームを設置しながら記事を作成しました。

 

表示される画面をほぼすべてキャプチャ(加工)しながら解説したので、長ったらしい解説になってしまいましたが、デフォルトでフォームを設置するだけなら簡単ですのでこの機会にぜひ設置してみてくださいね^^

 

Contact form 7では、多くの追加項目でカスタマイズすることができますが、メールフォームの利用目的はデフォルト設定でも十分機能すると思いませんか?

 

ユーザー(送信者)の立場からも使いやすいのが、シンプルイズベストというところですよね。

 

それはそうとメールフォームを作成しても、サイト内でグローバルメニュー等に設置しないと何の役にもたちませんよね。

 

この流れでグローバルナビの設置まで一気にこなすのは初心者の方には大変だと思います。

 

というか、僕自身が記事作成に時間がかかりすぎてしんどい状態です^^;

 

作業効率が悪すぎて想像以上に時間がかかってるんで、この記事はこれで終わりたいと思います。(疲れた~~!)

 

それではまた。

 

りゅうまるでした☆

↓↓↓↓↓↓

 

お問い合わせフォームを、グローバルナビやフッターメニューに設置する手順は、以下の記事を参考にしてくださいませm(__)m

 

あわせて読みたい

>>グローバルナビの設置方法を画像解説 ワードプレスCocoon編

 

あわせて読みたい

>>アドセンスで稼げるテーマ【Cocoon】申請から合格までを画像で徹底解説!

 

あわせて読みたい

>>アドセンスで稼げるテーマCocoon|広告設定最適化で収益アップ!

 

あわせて読みたい

>>アドセンスで稼ぎたい方必見!申請手順とログインエラーの解決策まとめ

今日のランキング

スポンサーリンク
スポンサーリンク
ワードプレス
スポンサーリンク
りゅうまるブログ

コメント

  1. […] 【WordPress】お問い合わせフォームの簡単設置方法を画像解説 […]

  2. […] 【WordPress】お問い合わせフォームの簡単設置方法を画像解説ワードプレスブログ内にお問い合わせフォームを作成、設置する方法を豊富な画像で解説しています。ワードプレスプラグイ […]