超初心者向け:お問い合わせフォーム簡単作成方法【はてなブログ】

本来であれば旅サイトを目指して更新を続けているはずの私ですが、コロナのお陰で旅へのモチベーションは全く上がらずブログの攻略ばかりをしています。

 

GoToトラベルなどと世間では盛り上がったりしていましたが、我家には90歳を超える長老が必死に生きておりまして、コロナを持ち込むわけにはいかないのです。

コロナが重症化する人は僅かだとか、陰謀説まで出てきたりする世の中ですが、コロナに限らずちょっとした風邪であっても確実に命に関わる人が身近にいると、怖いものなのです。

 

話は戻り、私は旅行する前に色々な方の旅ブログを読みあさるのですが、その際にもう少し細かいことを知りたいな…と思ったら知ってそうな方にはメッセージを送るんです。

私もその役割ができたら…と思いながら作成していたんですが、私のサイトにはお問い合わせフォームなるものが設置されていない状態だったんです。

私は今までどこからお問い合わせが来ると思っていたのでしょうか…

 

ということで、この記事ではお問い合わせフォームの作成から設定するまでの手順を簡単かつ手順通りに設定すれば10分で設定できるように解説していきます。

 

また、これはサイトにもよると思いますが、お仕事や相互リンクなどのご連絡を企業様から頂くこともあります。

これは、個人のサイト運営者にとってはチャンスになる可能性もありますので、チャンスの窓口である「お問い合わせフォーム」の設置を是非オススメします。

 
超初心者向け:お問い合わせフォーム簡単作成方法【はてなブログ】
 
 

f:id:lifeishappy_right:20200918213152j:image

 

お問い合わせフォーム

まず普通にブログ運営していて、お問い合わせフォームってそもそも必要なの?と思う方もいらっしゃるかと思います。

先日投稿した「プライバシーポリシー」については、ほとんどの方が設定必須となっていますが、お問い合わせフォームについては「個人営利利用」をされている方のみ設定が必須となっています。

プライバシーポリシーの設定については下記記事を参考にしていただければと思います。

参考:超初心者向け:プライバシーポリシー簡単作成方法【はてなブログ】

 

「個人営利利用」とは、例えばGoogleアドセンスを導入しようと思っている方や、アフィリエイトブログを運営されている方など、少しでも利益を発生させる要素のあるブログであれば、現状収益がなかったとしても必要となります。

 

これについては、はてなブログが2019年10月より個人営利利用が可能となり「はてなブログ個人営利利用ガイドライン」にも必須事項として記載されています。

個人営利利用のルール

連絡先の明示
上記営利利用の定義4に相当する教育利用を除き、営利利用ブログには情報発信の主体を明らかにするため下記のいずれかの方法で運営者の連絡先を明示するものとします。
自身でプライバシーポリシーを設けている場合、プライバシーポリシー内に記載
ブログのヘッダ、フッタ、サイドバー、プロフィールなど、どの記事からも確認できる箇所に記載
連絡先として表示する情報は、恒常的に受信できるメールアドレスなど、誰でも直接連絡が取れるものとしてください。コメント欄やSNSアカウントへのリプライなど公開での投稿、SNSのフォロワーや特定サービスの登録者のみが利用できるダイレクトメールやメッセージ機能などは連絡先とみなしません
ブログの内容に対して問い合わせや、訂正、削除などの依頼を受けた場合は、必ずご自身の責任において対応してください
ブログ作者が対応せず、はてなに対する削除依頼を受けた場合は非営利ブログと同様に「はてな情報削除の流れ」に沿って対応します。削除依頼の頻度や状況から管理体制に問題があると判断した場合、注意勧告や公開停止措置を取ることがことがあります
連絡先の明示がない場合や連絡先が明らかに虚偽の場合など、故意に連絡が取れない状態としていたり、問い合わせを行うことで連絡の内容や個人情報が公開されるなど問い合わせ者に不利益が生じる状態である場合には、事前の警告なく公開停止措置を取ることがあります

引用元:はてなブログ個人営利利用ガイドライン(2019年10月1日施行) - はてなブログ ヘルプ

本格的なアフィリエイトはやっていないけど、気付いたときに何となくアフィリエイト広告を貼り付けているなんて方でも営利利用となりますので、かなり多くの方が当てはまるかと思います。

 

お問い合わせフォーム:作成・設置

 

 ◆ Googleアカウント作成

 ◆ Googleフォームでフォームの作成

 ◆ 設置:はてなブログ

 

まずお問い合わせフォームは「Googleフォーム」で簡単に作れるので、それをはてなブログに設置するだけで完了となります。

 

Googleフォームを使用する際は、Googleアカウントが必要となりますので、アカウントのない方はアカウントの作成からしましょう。

Googleアカウントをお持ちの方は、アカウント作成は読み飛ばしてください。

 

Googleアカウント作成

 
Googleアカウント作成:Google アカウントの作成
 

アカウント作成画面に進みます。

 

STEP1:個人情報入力
 

f:id:lifeishappy_right:20201130125713p:plain

「姓」「名」「ユーザー名(希望のユーザー名)」「パスワード(希望のパスワード)」を入力して「次へ」をクリックして進みます。

 

STEP2:個人情報登録(非公開分)
 

f:id:lifeishappy_right:20201130130111p:plain

 

「電話番号」「生年月日」「性別」を入力します。

MEMO

電話番号が「省略可」となっていますが、Googleアカウントを使用する場合に承認が必要となり、その際に確認コードをGoogleから送ってもらう際に必要となりますので、登録しておきましょう。

全て入力完了したら「次へ」をクリックして進みます。

 

STEP3:プライバシーポリシーと利用規約の確認
 

f:id:lifeishappy_right:20201130130454p:plain

 

プライバシーポリシーと利用規約を読み、下へスクロールして「同意する」をクリックするとGoogleアカウントの作成は完了となります。

 

f:id:lifeishappy_right:20201130130918p:plain

次にGoogleアカウントを利用する為に認証作業をします。

 

 
STEP4:アカウント認証
 

f:id:lifeishappy_right:20201130131109p:plain

 

「ようこそ○○さん」のトップ画面のまま「個人情報」を選択して「電話」をクリックして進みます。

 

f:id:lifeishappy_right:20201130131300p:plain

「今すぐ確認」をクリックすると「電話番号の確認」のポップアップが出ます。

 

f:id:lifeishappy_right:20201130131425p:plain

「コードを入手」をクリックすると、先ほど登録した電話番号にGから始まるコードがSMSで届きます。

 

f:id:lifeishappy_right:20201130131756p:plain

コードを入力して「確認」をクリックしたら認証済みとなり、Googleアカウント作成完了及び運用が可能となります。

 

f:id:lifeishappy_right:20201130131941p:plain

 

Googleフォームでフォームの作成

 
公式サイト:Google フォーム
 

Googleフォームの画面トップに進みます。

f:id:lifeishappy_right:20200918170503p:plain

 

「Googleフォームを使ってみる」をクリックして進みます。

 

STEP1:フォームの選択
 

f:id:lifeishappy_right:20200918171020p:plain

 

新しいフォームを作成の画面で「空白」を選択してフォームの作成画面に進み、お問い合わせフォームに必要な項目の作成をします。

 

STEP2:「お名前」項目
 

f:id:lifeishappy_right:20200918172536p:plain

 
①無題フォーム お問い合わせフォーム
②無題の質問 お名前
③ラジオボタン 「記述式」に変更
④必須 お名前を必須項目にしたい場合は✔
必須でない場合は✔しない
 

⑤どちらをクリックしても質問項目を追加できるので、どちらかをクリックして残り「メールアドレス」「件名」「本文」項目を同様に作成します。

 

STEP3:「メールアドレス」「件名」「本文」項目
 

f:id:lifeishappy_right:20200918173657p:plain

 

「お名前」項目を作成したように作成していきます。

 
メールアドレス
質問 メールアドレス
ラジオボタン 記述式
必須 メールアドレスを必須項目にしたい場合は✔
必須でない場合は✔しない
 
件名
質問 件名
ラジオボタン 記述式
必須 件名を必須項目にしたい場合は✔
必須でない場合は✔しない
 
本文
質問 本文
ラジオボタン 段落
必須 本文を必須項目にしたい場合は✔
必須でない場合は✔しない
 

お問い合わせフォームに使用する項目の入力ができたら、画面右上にある歯車マークをクリックして「フォームの設定」画面に進みます。

f:id:lifeishappy_right:20200918175206p:plain

 

STEP4:フォームの設定
 

歯車マークをクリックするとポップアップで設定画面が出てくるので、「プレゼンテーション」の必要事項の入力・設定を行います。

f:id:lifeishappy_right:20200918175531p:plain

 

「別の回答を送信するためのリンクを表示」部分が、デフォルトでは☑が入っているのですが、☑を外します。

「確認メッセージ」は、お問い合わせいただいた際に、お問い合わせいただいた方へのメッセージとなります。

f:id:lifeishappy_right:20201217152559p:plain

 

「お問い合わせありがとうございました。」などお好みで問題ありません。

入力ができたら「保存」をクリックして最初の「フォーム入力画面」に戻ります。

 

STEP5:回答の設定
 

f:id:lifeishappy_right:20200918180146p:plain

フォーム入力画面で「回答」タブを選択します。

f:id:lifeishappy_right:20200918180641p:plain

 

回答ページ右上の三つの点をクリックします。

f:id:lifeishappy_right:20200918180810p:plain

 

「新しい回答についてのメール通知を受け取る」を選択しておけば、新しいお問い合わせがきた際に、メールが届くように設定できます。

これで、Googleフォームでの「お問い合わせフォームの作成」ができた状態で、右上に表示されている「送信」をクリックします。

f:id:lifeishappy_right:20200918181126p:plain

 

送信をクリックすると「フォームを送信」のポップアップが出てきます。

f:id:lifeishappy_right:20200918181650p:plain

 

フォームの送信画面で「<>」タブを選択して、HTMLコードを「コピー」します。 

MEMO

これで、Googleフォーム画面の使用は終了ですが、念のため全て終了するまでこの画面は残しておいてもいいかと思います。

 

設置:はてなブログ

お問い合わせフォームの設置ですが、はてなブログでは「無料版」の方と「有料版:Pro」の方で方法が違います。

 

 ◆ 有料版Proの方

 ◆ 無料版の方

 ◆ お問い合わせフォーム設置:有料版Pro・無料版

 

有料版Proの方

はてなブログProを利用している方は、固定ページでの設置となります。

まず固定ページの管理画面に進みます。

< ダッシュボード → 固定ページ → ページの管理画面 >

f:id:lifeishappy_right:20200917234725p:plain

 

お問い合わせフォームのページのURLを作成します。

※画面のURLが「privacy-policy」になっているのは、プライバシーポリシーの作成記事で使用した画像なので気にしないでください。

私は分かりやすく「contact」にしました。

URLを決めたら「ページを作る」をクリックします。

f:id:lifeishappy_right:20200918193606p:plain

普段使用している記事の編集画面と同様の画面(左上に「固定ページ」と記載があります。)になります。

タイトルは「お問い合わせフォーム」にして、本文に先ほどGoogleフォーム作成の最後にコピーしたお問い合わせフォームのリンクを貼って記事を「公開する」をクリックしてます。

 

ここで記事を公開にはしたのですが、固定ページで作成された記事はトップページや記事一覧、新着記事には掲載されていません。

そのため、サイドバーのリンクに表示させないと誰もお問い合わせフォームを認識することができませんので、リンクにお問い合わせフォームを設置します。

 

作成したお問い合わせフォームのURLをコピーして「お問い合わせフォーム設置:有料版Pro・無料版」に進んでください。 

MEMO

固定ページは通常のブログ記事同様、固定ページから内容編集や削除もできます。

 
無料版の方

通常の「記事を書く」画面での設置となります。

記事編集画面の「HTML編集」で編集をします。

f:id:lifeishappy_right:20200918183647p:plain

 

タイトルは「お問い合わせフォーム」にして、本文に先ほどGoogleフォーム作成の最後にコピーしたお問い合わせフォームのリンクを貼って、記事を「公開する」をクリックします。

MEMO

記事の公開前に、記事を過去日に修正することをオススメします。

本日の日付で記事を公開すると、読者登録していただいている方に、お問い合わせフォームが新着記事として反映されてしまうので、それを避けるためです。

もちろん気にしない方はそのままで問題ありません。

 

公開したら記事を確認して、お問い合わせフォームの記事のURLをコピーして「お問い合わせフォーム設置:有料版Pro・無料版」に進んでください。

 

お問い合わせフォーム設置:有料版Pro・無料版

サイドバーへお問い合わせフォームのリンクを設定します。

< ダッシュボード → デザイン設定 → カスタマイズ → サイドバー → リンク → 編集 >

f:id:lifeishappy_right:20200917235523p:plain

 

「リンク」がない方は「+モジュールを追加」で作成します。

f:id:lifeishappy_right:20200918191654p:plain

 

「+モジュールを追加」を選択して左側にある「リンク」を選択すればリンクの編集が可能となります。

 

「リンク」の「編集」をクリックすると「モジュールを編集」のポップアップが出てきます。

f:id:lifeishappy_right:20200917235657p:plain

 
タイトル リンク
リンク タイトル:お問い合わせフォーム
URL:お問い合わせフォームURL
 

全て入力できたら「適用」をクリックして、ダッシュボード左上にある「変更を保存する」をクリックしたら、お問い合わせフォームの設置作業全て完了となります。

f:id:lifeishappy_right:20201217171226p:plain


ブログトップページのサイドバーを確認すると、リンクのところに「お問い合わせフォーム」が反映されて、ここからお問い合わせフォームが確認できるようになっています。

f:id:lifeishappy_right:20200918194441p:plain

 

Googleフォームはガイドライン違反?

Googleフォームでお問い合わせフォームを作成して疑問をもたれた方いませんでしょうか。

お問い合わせフォームに関する「はてなブログ個人営利利用ガイドライン」では、使用するお問い合わせフォームは、「恒常的に受信できるメールアドレスなど、誰でも直接連絡が取れるものとしてください。」となっているのです。

連絡先として表示する情報は、恒常的に受信できるメールアドレスなど、誰でも直接連絡が取れるものとしてください。コメント欄やSNSアカウントへのリプライなど公開での投稿、SNSのフォロワーや特定サービスの登録者のみが利用できるダイレクトメールやメッセージ機能などは連絡先とみなしません

引用元:はてなブログ個人営利利用ガイドライン(2019年10月1日施行) - はてなブログ ヘルプ

Googleフォームを使用すると、どこにもメールアドレスが標示されていない状態となります。

ここでガイドライン違反?と思われた方、ご心配なく。

これについては、しっかりとはてなブログから了承を得た方法となっています。

連絡先の公開が義務付けられていますが、メールアドレスを公開したくありません。お問い合わせフォームへの誘導で大丈夫でしょうか?
メールアドレスの公開であっても、お問い合わせフォームの設置であっても、お問い合わせの内容やお問い合わせの個人情報がみだりに第三者に公開されず、直接連絡が取れる方法であれば問題ありません。
お問い合わせフォームの設置の際には、下記のような点に留意してご利用ください。
・個人で自作されたフォームの設置は推奨しません。プライバシーポリシーやお問い合わせ先などが公開されている企業の運営する暗号化されたフォームサービスをご利用ください
・フォームの設定として、問い合わせ内容などの個人情報が外部公開されないようになっているか、必ずご確認ください
・設置後も、正常に動作しているか、リンク切れとなっていないかなど、メンテナンスを継続的に行ってください

引用元:個人営利利用解禁に関する追加情報(よくいただくお問い合わせ) - はてなブログ開発ブログ

ということで、Googleフォームで問題ありません。

f:id:lifeishappy_right:20200910175344j:plain

 

記事のおさらい

 

 ✔ お問い合わせフォームの必要性

 ✔ お問い合わせフォームはGoogleフォームを使用

 ✔ はてなブログへの設定

 

実は私、行ったことのない国に行くとき、色んな旅人の方のブログを読んでは疑問に思ったことを積極的に問い合わせするんです。

ブログを読みあさって情報を探す場所って、そんなにメジャーではない場所が多い事もあって、結構古い記事だったりで放置されてもう数年…とかのブログも多くてお返事来ない場合が多いんです。

 

だから、そんな旅の問い合わせ窓口の一人になりたいと思ったんです。

私自身が何人もの方にお問い合わせメッセージを送ったりして、その中からお返事を頂けた方に色々と教えてもらったりしているんです。…迷惑な旅人ですみません(笑)

 

それなのに、そんな窓口役を目指している私のブログには問い合わせ先が設置されていない=全く窓口の役割を果たせていない!という事に気付いたのです(笑)

 

恐らく、お問い合わせフォームの設置手順なんて、旅行の検索をしている方に読まれることはないかと思いますが、もし読んでおられて私が言ったことのある国についてであれば、何か有益になる情報があるかもしれませんので、お気軽にご連絡いただければと思います。

 

分かる範囲で何でもお答えします♡