理系学生の茶の間のちゃ

理系学生の茶の間のちゃ

理系の私が日々の少し役に立ちそうなそうでもない情報をお届けします!

理系学生の茶の間のちゃ

【初心者ブロガー】お問い合わせフォームをGoogleでつくるよ!

こんにちは、ウタです。

 

嬉しいことに、このブログを見ていただける人も多くなってきました。

そこで、少しブログを整備する必要が出てきました.....

そこで、必要になるのは問い合わせフォーム!
ということで、お問い合わせフォームを作っていきたいと思います。

 

 

 みんなはどうやってお問い合わせに対応しているの?

 いろいろな人のブログを見ると、

連絡はこちら!
sample☆e-mail.co.jp(星をアットマークに変えてね!)

ってパターンが多いですよね。

 

あれよくやるよね。
怖くないのかな?

いくらブログ用のアドレスでも、おおっぴらにしとくのは非常に怖い!!
例えば、変なサイトに登録されたり、ブラックリストに載せられちゃったりしたら、其のアドレスは使えなくなってしまします。

 

怖くない人は上の方法で大丈夫です!
ノーガード戦法ですね!

でも、なるべくならアドレスを出さないで、お問合わせは受けたい!って人はいると思います!どうしたものか....。

 

Google「いいのがあるよ。」

マジっすか!

 

でも、お高いんでしょ.....?

Google「無料だよ。」

 

さすが、Google先生です。
さっそく、作りましょう。

Googleを使ってお問い合わせフォームを作ろう!

 今回お問い合わせフォームを作るときにこちらを参考にさせて頂きました!ありがとうございます!

www.ana-zoom.com

簡単に、お問い合わせフォームを作るまでを紹介していきます!

 

サービス一覧からフォームを見つけます。Googleアカウントが無い方は作ることができないので、この機会に作ってみてください。

f:id:hyrasan:20170620192330p:plain

「魅力的なフォームを作ろう」からGoogleフォームを使うをクリックしてください。

右下のプラスボタンを押すことで新規のフォームを作ることができます!

f:id:hyrasan:20170620192634p:plain

するとフォームの作成画面になります。
ここで、好きな質問を入れることができます。

必要な質問としては、お名前、メールアドレス、質問内容が基本になります。

f:id:hyrasan:20170620193128p:plain

 このときの文言がどう書いたらいいのか分からない人が多いと思います。
このブログのお問い合わせフォームを真似てもいいと思いますし、企業のサイトのお問い合わせフォームを参考にするといいと思います。

僕のお問い合わせフォームも、数社のお問い合わせフォームを参考にして作られています。

 

完成したフォームはこちら!! 

クリックするとお問い合わせフォームに移動します。

f:id:hyrasan:20170620190209p:plain

このように画像にリンクを付けてお問い合わせフォームを作りたいときは
「送信」から「リンク」を表示させてください!

f:id:hyrasan:20170620193609p:plain

リンクに表示されているアドレスをコピーして、画像にリンクを付けてください。

f:id:hyrasan:20170620194005p:plain

これで画像をクリックするとお問い合わせフォームに飛ぶようにできます。 

 

またHTMLを使って埋め込んで表示させるとこうなります!

 

 埋め込むと異常に邪魔だな。

 HTMLで埋め込みたいときは「送信」から「HTML」を表示させてください!

f:id:hyrasan:20170620194324p:plain

HTMLを埋め込むのところをコピーして、ブログ上部のHTML編集モードにします。

f:id:hyrasan:20170620194534p:plain

このモードは少し見にくいですが、ブログの内容がかかれています。

自分が表示させたいところに先程コピーしたものを貼り付けてください!

 

おわりに

お問い合わせフォームは大事なブログパーツだと思うので、やっていない方はやってみてはいかがでしょうか?