エルパの盤上この一手

勢いに任せたなんでもブログ

【画像あり】問い合わせフォームの簡単な作り方!【はてなブログ】

どうもこんにちは。

エルパです。

 

今後は、ブログの機能を拡充させていく上で

 

これええやん

 

っていうのをまとめていく記事が若干多くなりそうな今日このころです。

 

ということで、今日はお問い合わせフォームの作り方についてみていきたいと思います。

  

 

お問い合わせフォームを作る必要

まぁはっきり言ってメールアドレスをそのまま貼っちゃってもいいっていう人は、お問い合わせフォームなんて作る必要ないんですよね。

 

ただメールアドレスを貼ると、変なサイトに勝手に登録されたり、迷惑メールとかがいっぱいとどきそうですよね。

 

それにメールアドレスをいちいちコピーしてメールを送るのめんどいという方もいらっしゃるでしょう。

 

メールアドレス貼るのは嫌だけど、お問い合わせや連絡はいただきたいということで簡単にお問い合わせフォームをつくる方法を見ていきたいと思います。

Googleフォーム

ずばり今回使うのは、googleフォームというものです。

www.google.com

これで簡単に作成することができます。

天下のgoogle様ですから安心ですね。(ごますり)

 

作り方

まずは、上のリンクで飛んでログインします。

 

そしてトップにあるgoogleフォームを使うをクリックします。

f:id:elppapr:20170708133425p:plain

 

そして右下の➕ボタンを押して新規作成します。

 

f:id:elppapr:20170708133853p:plain

 

そうすると問い合わせフォーム作成に移ります。

 

ここで問い合わせフォームに必要だと思うものを追加していきます。

 

「名前」「メールアドレス」「お問い合わせの内容」は、必須じゃないでしょうか。

 

ということで作っていきます。

f:id:elppapr:20170708135000p:plain

 

画像の通りに変更していただければ、望み通りのものが作れると思います。

 

右の+ボタンで質問を追加できます。

 

質問の形式ですが、名前やメアドなど短くていいものは「記述式」を選択!

問い合わせ内容は、それらより長くなるでしょうから「段落」を選択!

 

そして、自分の望む項目を完成させたら、右上のボタンからプレビューを確認しましょう。

f:id:elppapr:20170708135545p:plain

 

そして今回出来上がったのがこんな感じです。

f:id:elppapr:20170708135629p:plain

かなりシンプルなものが出来上がりました。

もっと色々いじりたい人は挑戦してみてください。

 

ブログに使う

そこで完成したものを、今度はブログ側に載せましょう。

 

リンクを貼るのものいいのですが、今回はブログの記事として作成します。

 

右上の送信ボタンをクリックします。

そうするとフォームを送信というのが出てくるので、そのなかの<>ボタンをクリックします。

 

f:id:elppapr:20170708140450p:plain

 

そして画像の通り、HTMLを全部コピーします。

ここでサイズの調整もできます。

 

記事への張り方

そして先ほどコピーしたソースを新しい記事を作成し、HTML編集で貼り付ければ完成です。

 

これでいつも通り記事を公開すれば完成です。

 

ただこのまま公開すると新しい記事として公開されるのはいやだなーと思う方もいらっしゃいますよね。

 

僕もそうです。

 

それは過去の日付で投稿することで解決できます。

f:id:elppapr:20170708141700p:plain

投稿日時にお望みの日付を入れればOKです。

 

あとURLも変更できます。

普段の記事のURLは、日付と時間なのですが、格好つけて変えておきました。

 

まぁ問い合わせって調べたら出てきた英単語を入れただけなんですが。

ちなみに初めて知った単語でした。(かっこわる)

 

他の使い道も

今回は問い合わせフォームを作りましたが、このgoogleフォームを使って他のこともできると思うので、活用していただければと思います。

 

ということで、簡単に作れる問い合わせフォームの作り方でした。

 

 

質問ありましたら、問い合わせフォームより(決まった)

 

 

というのは嘘でコメントでもブックマークでもなんでもw

 

以上

 

ちなみに今回作った私のお問い合わせ

elppar.hatenablog.com