＜徹底解説＞はてなブログ(無料版)での問い合わせフォーム作成方法
(2019.8.14)
この記事では、上の写真の様にはてなブログ(無料版)で
サイドバーにお問い合わせフォームを作成する手順を解説します。
１．はじめに～なんで今更？
はてなブログ(無料版)にお問い合わせフォームを設置する方法を書いていきます。
検索してもらえればいくらでもブログ記事が出てきます。
記事を書いてもネットの海の底の藻屑となる事でしょう。
なぜ今更その様な記事を書くかと言うと以下の理由があります。
・有料版のはてなブログProでしか出来ない固定フォーム機能を
使った方法の記事が散見された。
・Googleフォームでお問い合わせフォームを作成するまでのプロセスまでは
丁寧に書いてあるが、はてなブログに貼り付ける具体的な方法が
最後まで画像付きで丁寧に解説している記事が見つからなかった。
上記から、私は本1冊といくつかのブログ記事からの知識を繋ぎ合わせて
悪戦苦闘して何とかお問い合わせフォームを作れました。
この記事で最後まで画像付きで説明するので誰かのお役に立てれば幸いです。
※有料版のはてなブログProを利用している方や、
「もう知ってるよ」と言う方には向かない記事です。悪しからずご了承下さい。
２．Googleフォームでのお問い合わせフォーム作成手順
・Googleフォームにアクセスします。
・Googleフォームにアクセスし「Googleフォームを使う」をクリック。
・空白をクリック
・ここからフォームを作っていきます。
・任意のタイトルをつけ、三点リーダ(:::)をクリックして次へ。
・名前欄のタイトルをつけ、ラジオボタンを押す。
・記述式を選択する。
・必須をONにする。
・お名前欄完成です。＋ボタンを押して項目を追加していきます。
・この要領で以下の項目を追加していきます。
※ 質問欄に入力する名称→ラジオボタンの選択項目→(必要な場合)必須、の順で
書いてます。
メールアドレス→記述式
件名→記述式
本文→記述式→必須
(お好みで)ブログ内での引用→チェックボックス
選択肢１→OKにする
選択肢を追加→選択肢２をNGにする
・ パレットマークをクリックするとテーマの色を変えられます。
・歯車マークをクリックします。
・プレゼンテーション項目に入る。
「別の回答を～」のチェックを外す。
確認メッセージを入力する。
・左上のｘボタンで元の画面に戻り、回答設定に入り、3点リーダをクリック。
・「新しい回答についての～」にチェック。
この設定によりお問い合わせが来たらメールで連絡がいくようになります。
・ここまで来たらフォームを再確認して間違いが無い事を確認します。
間違い無ければ、送信を押します。
・＜＞マークをクリック。HTMLを選択してコピー。
Googleフォームの方の設定はここまでです。
Xマークを押して終了してOKです。
引き続き、はてなブログを開いてつくったフォームを貼っていきましょう。
３．作成したフォームをはてなブログに貼り付けていく手順
・あなたのはてなブログのページを開き「記事を書く」で新規記事を立ち上げます。
・お問い合わせ、などのタイトルをつけます。
・「HTML編集」モードにして先程コピーしたHTMLコードを貼り付けして下さい。
・プレビュー画面で間違いが無い事を確認します。
・「編集オプション」で投稿日時を設定して下さい。
適当に過去の日付で設定して、見えない様にこっそり投稿する事をおすすめします。
私はブログ初投稿日の1日前に設定しました。
問題が無い事を確認して記事を投稿します。
・投稿した記事を開き、URLをコピーして下さい。
・はてなブログの「デザイン」画面に移動してください。
・「カスタマイズ」をクリックし、「サイドバー」をクリックして下さい。
※私の方には既に問合わせフォームが表示されてしまっており、申し訳ありません💦
あと少しです。
・＋モジュールを追加→リンク、タイトルを入力、
URL欄に先程の記事のURLを貼り付ける。
・適用をクリックするとサイドバーにお問い合わせが現れます！
お疲れ様でした！
おわり