ヒビラボでは、Cocoonをカスタマイズする方法やCSSコード（コピペ可）をまとめています。
ブログには「お問い合わせフォーム」を作りましょう。
お問い合わせページがあると読者にとって安心感が増し、サイトの信頼性も上がります。
- ブログの信頼性があがる
- 読者とコミュニケーションがとれる
- 企業からオファーがある
また、Google AdSenseに受かるためには「お問い合わせフォーム」はほぼ必須項目です。
ブログの信頼性を上げるためにお問い合わせフォームはぜひ設置しましょう！
お問い合わせフォームの作り方は選択肢が多い
お問い合わせフォームの作り方は選択肢が複数あります。
- WordPressのプラグイン
- Googleフォーム
- 問い合わせフォーム作成サービス
- コーディングで自作
悪質なスパムが届く可能性があるため、メールアドレスをそのまま載せるのはおすすめしません！
自動送信で大量のメールを送ってきたりするよ！
便利なのはWordPressのプラグイン「contact form 7」を使用する方法！
ブロガーに定番なのは、WordPressのプラグイン「contact form 7」を使用する方法です。
簡単にお問い合わせフォームを設置することができるのでとても便利です。
contact form 7 の設置方法
この記事では「contact form 7」の設置方法を説明します。
contact form 7 のプラグインをダウンロードする
まず、contact form 7 のプラグインをダウンロードします。
【プラグイン】→【新規プラグインを追加】をクリックします。
検索フォームに「contact form 7」と入力し、一覧に表示されたら「今すぐインストール」をクリックします。
「contact form 7」を有効化します。
最初からインストールされている「Hello Dolly」は、管理画面にルイ・アームストロングの代表曲「Hello, Dolly!」の歌詞の１節を表示するというお遊び的なプラグインなので削除して大丈夫です。
contact form 7 の設定をする
「contact form 7」を有効化したら、「設定」の表示に変化するのでクリックします。
最初からある「コンタクトフォーム1」を編集します。
【フォーム】タブの内容を編集します。
<label> 氏名
[text* your-name autocomplete:name] </label>
<label> メールアドレス
[email* your-email autocomplete:email] </label>
<label> メールアドレス（確認）
[email* your-email autocomplete:email] </label>
[quiz title-quiz "クイズの内容|答え"]
<label> タイトル
[text* your-subject] </label>
<label> メッセージ本文
[textarea* your-message] </label>
[submit "送信"]当ブログでは [quiz title-quiz “当ブログの名前をカタカナ４文字で入力してください（スパム対策のため）|ヒビラボ”]という簡単なクイズをスパム対策のために設置しています。
対策になっているかは不明だけどやらないよりマシかも！
【メール】タブで送信したい送信先のメールアドレスを入力します。
できれば送信先用に専用のメールアドレスを作りましょう。
理由は、スパム攻撃を受けてしまったときにメールアドレスを簡単に変更できるからです。
おすすめは以下の無料メールです。
フォーム名を「コンタクトフォーム１」から「お問い合わせフォーム」などわかりやすい名前に変更して保存します。
固定ページで「お問い合わせ」ページを作成する
続いて、固定ページで「お問い合わせ」ページを作成します。
【固定ページ】→【新規固定ページを追加】をクリックします。
①タイトルに「お問い合わせ」を入力します。
②フォームの案内文があれば丁寧です。
③文章中で「+」ボタンを押すと、検索フォームが出るので「コンタクトフォーム」と入力します。
「Contact Form 7」が表示されたらクリックします。
先ほど作成したフォーム名が表示されるので選択します。
【公開】ボタンを押すと完成です！
「Contact Form 7」で表示されるショートコードを入力してもフォームが表示されます。
無事にフォームが表示された！
不正アクセス対策でGoogle reCAPTCHAを導入しよう
お問い合わせフォームが完成しましたが、実は不正アクセス対策が不十分です。
Google reCAPTCHAを導入して、不正アクセスの心配を減らしましょう。
Google reCAPTCHA導入については「【WordPress】Google reCAPTCHA導入とロゴマーク非表示の方法」の記事でまとめています。
