【Cocoon】問い合わせフォームの作り方を画像付きで解説 | まるっとふくち
PR

【Cocoon】問い合わせフォームの作り方を画像付きで解説

スポンサーリンク
問い合わせフォーム設置方法Cocoon

この記事のリンクにはプロモーション(広告)が含まれています。感想・レビューなどは誇張せずに正直に書いております。

こまるちゃん
こまるちゃん

ブログを始めたんだけど、問い合わせフォームて必要?

ふくち
ふくち

問い合わせフォームはブログには必須!ブログの利便性や読者からの信頼感・そしてGoogleAdsense対策としても早めに作っておいたほうがいいよ!

当記事ではWordPressの無料テーマCocoonユーザー向け

ブログに必須の「問い合わせフォーム」の作り方を解説します。

Cocoonにはお問合せフォームの機能がないため、「Contact form7」という無料プラグインを使用して作成します。

この記事でわかること
  • 問い合わせフォームが必要な理由
  • Cocoonで問い合わせフォームを設置する方法(無料プラグインContact Form7使用)

作り方は操作画面の画像付きで解説するので、その通りに進めればすぐにお問合せフォームとして機能してくれます。

早速見ていきましょう!

\すぐに設置方法を知りたい方/

目次から「2.ブログの問い合わせフォームの作り方」へジャンプしてください↓

スポンサーリンク

ブログに問い合わせフォームを設置する理由

疑問を抱える女性のイラスト

そもそも問い合わせフォームはなぜ必要なのでしょうか?

個人のブログならなくても良いのでは?と思う方もいらっしゃると思いますが、アフィリエイトブログには必須です。

理由は大きく2点

  • ブログの信頼性を高めてくれる
  • 仕事の依頼を受ける窓口になる

それぞれ見ていきましょう。

ブログの信用性を高めてくれる

右上向きの矢印にデスクでパソコン作業をしている男性がいる様子

問い合わせフォームが設置されていると、ブログの信用性が高まります

読者がブログ管理者へ何か伝えたいことがある場合、問い合わせ先がないとどうなるか。

ふくち
ふくち

コメントでこと足りる場合もありますが、内容によってはこっそり運営者へ聞きたい、知らせたい場合もありますよね。

お問い合わせフォームが設置してあれば、読者からの連絡が可能です。

それと同時に、「このブログは読者のことを考えている」と、検索エンジンからの評価や信頼にもつながります。

Googleアドセンスの審査にも必須の項目です!

Googleアドセンスとは
Google社の提供するコンテンツ連動型広告配信サービスです。ブログの内容や読者の閲覧履歴などに基づいた広告を掲載し、広告が閲覧・クリックされるとその数に応じて報酬が得られるサービスです。広告タイプとしては「クリック報酬型」と呼ばれています

\Googleアドセンス合格記/

\ブログ運営に必須の言葉をまとめて学ぶ!/

お問い合わせフォームは仕事の依頼窓口になる

オペレーターの女性

ブログ運営をしていると、企業から広告掲載のオファーがくる場合があります。

実際、わたしもお問い合わせフォームから何度か広告のオファーをいただいたことがあります。

ふくち
ふくち

広告掲載の依頼は詐欺の可能性もあります!安請け合いせずに、身元の名前や連絡先などはしっかり確認して判断しましょう。

ブログの収益化を考えているのであれば問合せフォームは必須です

TwitterなどのSNSと連携している場合は、SNSを問合せ先にすることも可能ですが、読者がそのSNSを利用しているとは限らないのでそれだけでは不親切な場合があります。

ブログの問い合わせフォームの作り方 

パズルのピースを持っている人々

Cocoonでお問合せフォームを作成する方法にをお話しします。

WordPressのプラグイン「Contact Form7」を利用すればとってもカンタンに設置出来ます!

Contact Form7とは
WordPressのプラグイン(拡張機能)の1つ。

お問合せフォーム用のプラグインは他にもありますが、このContact Form7はシンプルで使い勝手も良く人気。日本人の方が開発したプラグインで、公式サイトのFAQなどもわかりやすく整備されています。

≫Contact Form7公式サイトはこちら

手順は下記の通りです。

CocoonでContact Form7を利用する方法
  • プラグインの新規追加からContact Form7をインストール・有効化する
  • Cocoonのお問い合わせ内にContact Form7を設置する
  • 各種設定を行う
ふくち
ふくち

問合せフォームの設置から細かな設定まで終えることができますよ!

Contact Form7のインストール方法

インストールしているパソコン画面と2人の男性

WordPressのプラグインContact Form7のインストール方法です。

①Wordpressログイン後の管理画面
 左側の「プラグイン」を選択し、上の方にある「新規追加」をクリック

Wordpressの管理画面からプラグインを新規追加している画面

②検索窓に「Contact Form7」と入力して検索
 富士山マークのContact Form7が出てくるので「今すぐインストール」をクリック

Wordpressのプラグイン新規追加画面

インストールが完了したら必ず「有効化」をクリックしましょう。

Contact Form7の設定方法 

スマートフォンと虫眼鏡、工具を持っている男性

次にコンタクトフォームの設置と設定を行います。

コンタクトフォームの新規作成

WordPress画面左側のサイドメニュー内、お問い合わせの新規追加をクリックすると下記の画面になります。

任意のタイトルを入力します。

ふくち
ふくち

タイトルは読者の目にふれることはないのでなんでもOKです!

Wordpressのお問い合わせフォーム編集画面

Contact Form7の各種設定

コンタクトフォーム内の設定を行います。

4つのタブをそれぞれ設定していきます。

  1. フォーム
    お問い合わせに含める内容を設定
  2. メール
    問合せがあった場合の通知、自動返信
  3. メッセージ
    返信内容の設定
  4. その他設定
    更にカスタマイズが必要な場合に使用

項目ごとに設定内容を見ていきましょう。

フォームの設定

こちらは必要最小限の設定はされているので、特にいじらなくて大丈夫です。

メールの設定

メールの設定画面では下記の項目を設定します。

1の送信先以外は実際に使ってみて勝手が悪くなければ、デフォルトのままで問題ないかと思います。

メールの設定項目
  1. 送信先:問い合わせを受けた内容を受け取るアドレス。デフォルトではサイト管理者のメールアドレスになっているので別のアドレスに変更の場合はこちらへ入力
  2. 送信元:お問い合わせメールの送信元アドレス(既定のものでOK)
  3. 題名:メールの件名
  4. 追加ヘッダー:メールの返信先(デフォルトは問合せ者のアドレス)
  5. メッセージ本文:メール本文
  6. ファイル添付:特に必要なし
Wordpressのお問い合わせフォーム編集画面

さらに下の方へスクロールすると「メール2」の設定が出てきます。

問合せを受信した際に取り急ぎ自動返信ができますので設定することをおすすめします。

変更する箇所は「3.メールの件名」のみでOKです。

メール2の設定項目
  1. 送信先:問い合わせをした方のメールアドレス
  2. 送信元:お問い合わせメールの送信元アドレス(既定のものでOK)
  3. 題名:メールの件名
       →デフォルトは[_site_title] “[your-subject]”となっているので、下記の通り変更
        [_site_title] お問い合わせを受け付けました。
  4. 追加ヘッダー:メールの返信先(デフォルトは問合せ者のアドレス)
  5. メッセージ本文:メール本文
  6. ファイル添付:特に必要なし
メッセージの設定

お問い合わせフォームで表示される内容を変更できます。

例えば、

メッセージが正常に送信された場合

ありがとうございます。メッセージは送信されました。

など。

ふくち
ふくち

変更しなくても大丈夫ですが、お好みでカスタマイズしてみましょう!

その他設定

こちらも特に手を加える必要はありません。

お問い合わせページの作成

パズルのピースを持っている人々

お問い合わせフォームの準備がととのったら、実際にお問い合わせページを作成してみましょう!

①Wordpress管理画面のサイドメニュー、固定ページ→新規追加をクリック

Wordpressの管理画面サイドメニューから固定ページを追加する画面

②タイトルを好きなものに変更(お問い合わせなど)

③ブロック追加ボタンをクリック

Wordpressのお問い合わせフォーム編集画面

④ブロックの検索窓に「contact」などと入力すると富士山のマークが出てくるのでクリック

Wordpressブロック検索画面

⑤コンタクトフォームの作成は1つのみかと思いますので「コンタクトフォーム1」のままでOKです。

Wordpressのお問い合わせフォーム設定画面

お問い合わせページにはSEO対策は必要ないので、SEOの欄などは空欄でOKです。

⑥プレビューをチェックして問題なければ最後に公開をクリックしましょう。

ちなみに、当サイトの問合せフォームは下記です。

タイトルの下に段落を追加して文章を差し込んでいます。

当サイトのお問い合わせフォーム画像

フッター・ヘッダーに「お問い合わせ」メニューを追加する

封筒の上に座っている女性

最後に、サイトのヘッダーやフッターにお問い合わせの項目が表示されるように設定します。

ヘッダーに設置したい場合は、「フッター」部分を「ヘッダー」と読み替えて貰えばOK!

当サイトでは画面の下方に表示されるフッターメニューに配置しておりますので、その方法を教えます。

ふくち
ふくち

色々なサイトを見るとわかりますが、どのページからでも見られる「ヘッダー」か「フッター」に配置しているサイトがほとんどです。

実際こんな感じで配置しています。

当サイトのフッターメニュー画像

では、具体的な方法です。

Wordpressのサイドメニュー外観からメニューを選択している画像

WordPress管理画面のサイドメニューから外観→メニューを選択

メニューの作成ページが開きます。

フッダーメニューがない場合の7ステップ

女性が階段をのぼっているイラスト

これからフッターメニューを作成する場合の手順です。

【フッターの作成方法】

①「新しいメニューを作成しましょう」をクリック

②メニュー名を入力

③フッターメニューとフッターモバイルボタンにチェック

④メニューを作成をクリック

フッターメニュー作成の画面

この後は次の「フッターメニューがすでにある場合の3ステップ」と同様です。

フッターメニューがすでにある場合の3ステップ

フッターメニューがすでに作成されている場合の手順です。

①編集するメニューからフッターを選んで選択

②お問い合わせにチェック

③メニューに追加をクリック

フッターメニュー編集画面
ふくち
ふくち

以上のステップでフッターメニューにお問い合わせの項目が追加されます!

設置できたかどうか、プレビューで確認してみましょう!

まとめ:ブログのお問い合わせフォームの作り方

まとめ

本日は以下のことをお話しました。

  • 問合せフォームはブログを運営する上で必須であること。
  • 問合せフォームの作成方法
    Contact Form7を使えばカンタン!
  • 問合せページの作成方法とフッダーへの設置方法
ふくち
ふくち

1度やれば終わる完結型の作業なので、早めに済ませてしまいましょう!

\安全性が向上する!/

タイトルとURLをコピーしました