【はてなブログ】お問い合わせフォームを設置する方法

今回は、お問い合わせフォームを設置しましたので、その方法をまとめました。

Googleアドセンスを申請する際、はてなブログでは、お問い合わせフォームの設置を必須としており、プライバシーポリシーと同様、固定ページをとして設置することを推奨しています。

私もこの目的で設置しました。

 

今回紹介する、お問い合わせフォームの作り方は、Google Chrome の機能を使うものになります。

 

Google Chromeでフォームを作成する

Google Chrome ブラウザを起動し、Googleのソリューション一覧を表示します。

f:id:naru443:20200705225500p:plain

こんな画面が出てきます。スクロールしてどんどん下に進みましょう。

f:id:naru443:20200705225543p:plain

すると、紫色の「フォーム」というマークがでてくるので、これをクリックします。

f:id:naru443:20200705225744p:plain

こういうページがでてくるので、「Googleフォームを使ってみる」をクリック。

f:id:naru443:20200705225835p:plain

新しいフォームを作成

f:id:naru443:20200705230035p:plain

こんな画面になります。

f:id:naru443:20200705230253p:plain

以下の要領で内容を作っていきます。

① 無題 →「お問い合わせフォーム」に変更

②フォームの説明:「(名前)のお問い合わせフォームです」※(名前)は適当にいれる

③無題の質問: 「お名前」と入力

④その右側、ラジオボタン→「記述式テキスト」に変更

⑤ 画面右下「必須」を選択

 

ここまでで、こんな画面になりましたね。

f:id:naru443:20200705230940p:plain

つづけて、+ボタンを押して追加しながら「お名前」以外の項目を追加していきます。

・メールアドレス

・件名

・お問い合わせ内容 ※「段落」を選びます。これで長文回答となります。

f:id:naru443:20200705231356p:plain

画面右上の「送信」をクリック

f:id:naru443:20200705231540p:plain

するとこんな画面がでます。

「<>」マークをクリック →幅と高さを変更 →「HTMLを埋め込む」に表示された<iframe src=…の部分をコピー

f:id:naru443:20200705231816p:plain

 

はてなブログのaboutページにリンクを貼り付ける 

先ほどコピーしたリンクを、aboutページ編集の自由記述欄に貼り付けます。

f:id:naru443:20200705232255p:plain

すると、このようなフォームができあがります。

f:id:naru443:20200705232432p:plain

実際に適当に空欄を埋めてテスト送信してみて、届いていればOKです。