嫌いな中国出張はきっと好きになる

中国20都市以上を訪問!中国情報や出張情報をお届け!

Googleフォームを使ったら問い合わせフォームがはてなブログに簡単に設置できた

先日、ブログの師匠的な方から「問い合わせフォームは設置したほうがいいよ」とアドバイスを頂きました。これまで自分は問い合わせフォームの設置には無関心でしたが、自分なりに以下3点のメリットがあるなと考えて設置することにしました。

  • 問い合わせフォームが設置されていた方が玄人感がある
  • 相談・連絡、交流のきっかけになるかもしれない
  • 今後ブログが成長したときに何かしら仕事の依頼が来るかもしれない

というか、設定するのにデメリットが特にないのでやってみるかって感じです。

 

大学院の研究室HPによくある”メールアドレスをそのまま張り付け”みたいなことはしたくないなと思っていました↓(こんな感じ)↓ 

daigaku☆gmail.com(☆を@に変更して送信)

 

アドレスをブログに載せること自体抵抗がありますし、ユーザーもいちいち☆を@に変更するのは面倒くさいと思います。そこでGoogleフォームというGoogleの機能を使ったことで、簡単にフォームを作ることができました。

とても簡単なので、問い合わせフォームを作りたいと思っている方はぜひ参考にしてみて下さい。

f:id:OKUSURI:20170820042727p:plain

 

 

Googleフォームとは

アンケートや問い合わせフォームを作成することができます。もちろん無料で。使いこなせば高度なアンケートや回答結果をデータ化・分析したりすることもできるらしい。けど、自分は単純な問い合わせフォームで充分。Googleフォームだと無料で簡単にフォームが設置できるので非常に助かります。Googleって本当にすごいよなあ。

www.google.com

 Googleフォームを使った問い合わせフォームの作成方法

トップ画面にある「Googleフォームを使う」をクリックします。すると以下の画面に移りますので、右下の+ボタンをクリックしましょう。

f:id:OKUSURI:20170820043935p:plain

 

すると、以下の問い合わせフォーム作成画面に遷移するので、自分の作りたいフォームを作成していきます。自分は「お名前」「返信用のメールアドレス」「問い合わせ内容」の3つを設置しました。3とも全て必須項目にしちゃいましょう。

f:id:OKUSURI:20170820050502p:plain

短い回答であれば「記述式」を選択しましょう。お名前とメールアドレスは記述式でOK]です。一方、長い回答であれば「段落」を選択するべきなので、問い合わせ内容は「段落」がベターです。

 

項目ごとに必須が選べるので必須としましょう。

 

f:id:OKUSURI:20170820050828p:plain

 大体出来上がったら、右上のパレットのようなアイコンで色を選択します。その後、その横にある目のようなアイコンでプレビューして確認しましょう。

 

f:id:OKUSURI:20170820051200p:plain

 

 これでフォームは完成です。自分はサイドバーにリンクを貼っていますが完成系はこんな感じです。シンプルでいい感じ。

 

f:id:OKUSURI:20170820051425p:plain

はてなブログに設置しよう

フォームが完成したら画面右上にある「送信」ボタンをクリックします。するとフォームを送信という下記のようなウィンドウが出てくるので、ここでリンクアイコンを選択してリンクをコピーします。

f:id:OKUSURI:20170820052303p:plain

 これをはてなブログのサイドバーに設置すればOKです!!

注意点

設置後は必ず自分でデモンストレーションしてみましょう。意外と使いにくいなど送受信が上手くできないなどがあるはずなので確認してみましょう。

自分で問い合わせしてみると、「回答」が出現するので右側にある青矢印のアイコンをクリックしましょう。

 

f:id:OKUSURI:20170820053049p:plain

 

すると下記のウィンドウがでるので「新しい回答についてのメール通知を受け取る」をチェックしましょう。こうしないと問い合わせを受け付けたとき通知が来ないので、返信が遅れてしまいます。ぜひ設定することをおススメします。

 

f:id:OKUSURI:20170820053214p:plain

 

まとめ

Googleを使えば簡単かつ無料で問い合わせフォームをつくることができました。興味がある人がぜひ設置してみてください!簡単ですよ!

 

 

 

 

www.xn--w8j321gotcvugqqd7tl.com

www.xn--w8j321gotcvugqqd7tl.com

www.xn--w8j321gotcvugqqd7tl.com

スポンサーリンク