【無料版】はてなブログにお問い合わせフォームを設置する方法
はじめに
前回の無料版はてなブログにプライバシーポリシーページを設置する記事の続きとなります！
その前回記事はこちらです↓
私自身ブログを始めて3日目となりますが、ブログの設定などを解説しているサイトを見ても詰まったりすることも多いです(笑) なので、私と同じようなブログ完全初心者の方で悩んでいる方にも分かるように丁寧に図解をしていきます！
前提条件
- Gmailアカウントを持っている
- Google Chromeブラウザを導入済み
- はてなブログ無料版
前提条件ですが、ブログをやっている方ならインストールされている場合が多いと思います！導入していない方のためにもリンクを貼っておきます！
Google Chrome ブラウザ
https://support.google.com/chrome/answer/95346?co=GENIE.Platform%3DDesktop&hl=ja
↑ここから、各OSに合ったものをダウンロードしてください。
今回のお問い合わせフォームもaboutページ編集の自由記述欄にhtmlの記述をしていきます。では、見ていきましょう！
お問い合わせフォーム設置
では、手順を説明します。
お問い合わせフォーム設置手順
- Google Chromeを開きフォームを選択
- Googleフォーム新規作成
- 各欄を埋める(お問い合わせフォーム、メールアドレス、件名、お問い合わせ内容
- お問い合わせフォームのhtmlをコピーし自由記述欄に張り付け
- プロフィールと動作確認
1 Google Chromeを開きフォームを選択
まず、Google Chromeブラウザを開きます。
図1右上の3×3の四角が並んだアイコンをクリックすると下に色んなアイコンが出てきます。次に、もっと見るボタンを押すと、さらにもっとが出てくるので選択してください。
すると図2のようなスクロール型のページが出てくるので、下までスクロールし紫のアイコンのフォームを選択してください
2 Googleフォーム新規作成
次に、フォームを作成します。1までの手順を行うと図3のようなページが出てくると思います。そして、Google フォームを使うを選択してください。
図4のページが開くので空白を選択してください。
3 各欄を埋める
前回の操作まででこのページが表示されたらお問い合わせフォームに必要な各欄を埋めるていきます。
① お問い合わせフォームに変えてください
② (名前)のお問い合わせフォームに変えてください。*(名前)は任意の名前で！
③ お名前と入れてください。(これはお問い合わせされる方の名前です)
④ ラジオボタン選択し、一番上の記述式に変えてください(これで短文が書けます)
⑤ 必須を選択してください。
次に、図6と同様に＋ボタンを押して追加しながら、各欄を埋めてください。メールアドレスは必須は任意です。
注意として、お問い合わせ内容だけは記述式でなく段落を選んでください！
これにより長文が書けます。
4 お問い合わせフォームのhtmlをコピーし自由記述欄に貼りつけ
続いて、右上の方にある送信ボタンを選択してください(htmlをコピーするだけです)。すると、図7のようになると思います。そして、< >ボタンを選択し、幅と高さを変え、HTMLをコピーしてください。
5 プロフィールの確認と動作確認
HTMLをコピーしたらaboutページ編集の自由記述欄に貼り付けてください。
保存後、プロフィール欄を見に行ってください！
お問い合わせフォームが設置されていると思います。適当に空欄を埋めて送信してみてください！
図9の回答の方に届いていれば動作確認終了です！
おわりに
長々と書いてしまい、分かりにくい部分もあったと思います。もしあったらコメントしてください！
最後に参考にさせていただいたサイトを紹介します！
このサイトだけでも十分ですが無料版ではどうするのか？との問いの一つの方法となれば幸いです！
余談ですが、ブログ村にも登録してみました！
下の方にありますが良かったら押してください！励みになります(笑)
