Cocoonでお問い合わせフォームを作るにはどうしたらいいの？
こんなブログ初心者の疑問にお答えします。
この記事を読めばWordPressのブログでお問い合わせフォームを作れるようになります。
ブログで収益を上げようと思った時、お問い合わせフォームの設置は必須です。
ブログが成長してくるとお問い合わせフォームから仕事の依頼が来たりすることも！
5分もあれば設置できるのでとりあえず作成しておきましょう。
当サイトの様な陸マイラーブログではお問い合わせフォームの役割は超重要！
お問い合わせフォームを通してSPGアメックスなどのクレカ紹介依頼を受け付けるので設置は必須です。
この記事ではWordPressのテーマ「Cocoon」でお問い合わせフォームを設置する方法を画像付きで丁寧に解説します。
Cocoonにお問い合わせフォーム機能はない
Cocoon自体にお問い合わせフォームを作る機能はありません。
Cocoonでお問い合わせフォームを作るにはプラグインが必要です。
さまざまな機能を追加することができるWordPressのしくみです、WordPress自体の機能はシンプルですが、プラグインを入れることで必要な機能を追加することができます。
お問い合わせフォームを作ることができるワードプレスのプラグインはいくつかありますが、一番おすすめは「Contact Form7」です、
Contact Form7は完全無料で利用することができ高機能なので多くのブログで利用されています。
当ブログのお問い合わせフォームも「Contact Form7」で作成しています。
このようなお問い合わせフォームが作成できます。
Cocoonでお問い合わせフォームを作るならContact Form7を使おう
Cocoonでお問い合わせフォームを作る方法をContact Form7のインストールから順番に解説していきます。
作業の流れは以下の通りです。
- Contact Form7をインストール
- お問い合わせフォームを作成
- 固定ページを作成
- お問い合わせフォームを貼り付け
順に解説していきます。
Contact Form7のインストール
初めにContact Form7をインストールして有効化します。
WordPressのダッシュボードの左のメニューから「プラグイン」の「新規追加」をクリックします。
右上にある検索窓に「Contact Form 7」と入力します。
検索結果に表示されたContact Form 7の「今すぐインストール」をクリックします。
インストールが完了したら「有効化」をクリックします。
左のメニューに「お問い合わせ」が表示されたらインストール完了です。
お問い合わせフォームを作成
続いてお問い合わせフォームを作成します。
メニューの「お問い合わせ」の「新規追加」をクリックします。
コンタクトフォームの作成画面が表示されます。
Contact Form 7ではいろいろなカスタマイズができるのですが、この記事では最低限必要な設定だけを解説していきます。
初めにお問い合わせフォームのタイトルを入力します。
その他に設定箇所がたくさんありますが基本的に変更しなくても問題ありません。
そのまま「保存」ボタンを押して次のステップへ進んでください。
設定内容を確認、カスタマイズしたい場合は下記で説明します。
はじめにフォームタブの設定です。
フォームタブではお問い合わせフォームに表示する内容を設定します。
特にこだわりがなければ変更は必要ありません。
<label>の後の文字（お名前など）を修正するとお問い合わせフォームに表示する文字列を変更できます。
続いてメールタブの設定です。
お問い合わせフォームが入力された後に送信するメールの設定を行います。
お問い合わせフォームを読者が送信した際に入力された内容が自分にメールで届くようにします。
- 送信先：メールが送信される宛先のメールアドレスです。
メールを送りたい自分のメールアドレスを設定します。
デフォルトではWordPressの設定で入力したメールアドレスが入っています。 - 送信元：メールを送信する元のアドレスです。
- 題名：メールの件名です。
your subjectの部分にユーザーが入力したタイトルが表示されます。 - 追加ヘッダー：送られてきたメールに返信するときにデフォルトで入力されるメールアドレスです。デフォルトではユーザーが入力したメールアドレスになっています。
- メッセージ本文：メールの本文に表示される内容です。
メッセージタブはユーザーがお問い合わせフォームを送信した後やエラーの際に表示されるメッセージを設定します。
好みの文章に変更してください。
その他設定タブはカスタマイズを行う際に使用します。
今回は何も設定しなくて大丈夫です。
設定が終わったら「保存」ボタンをクリックします。
保存が成功するとお問い合わせフォームを貼り付けるためのショートコードが表示されます。
このショートコードをコピーしてお問い合わせフォームを表示したい場所に貼り付けます。
固定ページを作成して貼り付ける
Contact Form 7で作成したお問い合わせフォームは投稿ページでも固定ページでも表示することができます。
投稿ページと固定ページの違いは以下の通りです。
- 投稿ページ
新着やカテゴリーページに表示される。
ブログ記事に使用 - 固定ページ
新着やカテゴリーページには表示されない。
トップページやお問い合わせフォームなどに使用
お問い合わせフォームは新着記事やカテゴリーページに表示させる必要はないので、固定ページで作成します。
左のメニューから「固定ページ」>「新規追加」をクリックします。
固定ページの新規作成画面が開くので、ページのタイトルと表示したい内容を入力します。
先ほどのショートコードを貼り付ければお問い合わせフォームが表示できます。
必要に応じて注意書きなどの文章も記入します。
忘れずにパーマリンクも設定しましょう。
パーマリンクはページのURLのドメイン名の後に続く文字列のことです。
パーマリンクは検索順位やブログの評価に大きく関係します。
後で変更すると影響が大きくなるので初めに正しい方法で登録しましょう。
パーマリンクの決め方やワードプレスでの初期設定方法を以下の記事で解説しています。
>> 詳細記事 【簡単1分】パーマリンクの決め方講座！ワードプレスの設定方法も解説！変更できない時はどうするの？
全ての入力が終わったら「プレビュー」で表示内容に問題がないか確認して「公開する」ボタンをクリックします。
お問い合わせページへのリンクを作る
お問い合わせページの作成は以上で完了です。
ただし作っただけではブログのどこからも辿れません。
お問い合わせページにたどり着けるようにリンクを作成します。
フッターメニューにプライバシーポリシーなどと一緒に表示させておけばよいでしょう。
すでにフッターメニューを作成している場合は、先ほど作成したお問い合わせページを追加してください。
これですべての作業は終了です。
完成したお問い合わせフォームに入力してメールが正常に送信されることを確認してください。
Cocoonでお問い合わせフォームを作る方法まとめ
Cocoonでお問い合わせフォームを作るにはContact Form 7を使うのが一番簡単な方法です。
５分もあれば設置できるのでブログを立ち上げたらすぐに設定しておきましょう。
お問い合わせフォームの設置はプライバシーポリシーページと合わせてGoogleアドセンスの合格にも必要です。
下記の記事でCocoonでGoogleアドセンスに関する設定方法をすべてまとめています。
>>関連記事 CocoonでGoogleアドセンスの審査申請から広告設置までの設定方法を初心者向けに解説
WordPressの使い方を基礎から一通り学びたい人にはこちらのほんがおすすめ
ブログランキング参加中！応援お願いします。
にほんブログ村
コメント