【初めてでも図解で簡単】Googleフォームでお問い合わせを作ろう!

【初めてでも図解で簡単】Googleフォームでお問い合わせを作ろう!

マーくん

WEBディレクターのボクが断言します!

いまブログ(Wordpress)にサクッとお問い合わせフォームを設置するとしたら、
一番簡単な方法は「Google フォーム」で間違いないです。

MEMO
Google フォームとはGoogleが提供しているオンラインサービスで、WEB上でのアンケートやお問い合わせフォームを、誰でも簡単に無料で作成することができます。

デザインの自由度こそ少ないけど、wordpressでブログを作る人には有名な
あの「Contact Form 7」より簡単にお問い合わせフォームを作ることができます。

もちろんモバイル対応ですよ!

マーくん

Googleのアカウントを持っていて、gmailを多少でも使っている方が対象の記事です。

今回作る「お問い合わせフォーム」はコレ

当ゴジュスタサイトのお問い合わせフォームも「Google フォーム」で作成しました。Googleアドセンスも問題なく合格しています。

5項目の設問があるお問い合わせフォーム

今回は上記のオレンジで囲った部分、5項目の設問があるお問い合わせフォームを作っていきます。

お問い合わせフォームを新規作成

それではさっそくお問い合わせフォームを作っていきましょう!
Googleフォームの作成ページを開いてください。

参考 Googleフォームの作成ページGoogle公式サイト

Googleフォームを使うボタンをクリック!

「Google フォームを使う」ボタンをクリックすると、下記画面が表示されたと思います。

「空白」ボタンをクリックして新規フォームを作成

「空白」ボタンをクリックして新規フォームを作成しましょう。

お問い合わせ項目を設定しよう

新規フォーム作成画面が表示されました。

さあフォームを作成していきましょう!

フォームのタイトルを設定

フォームのタイトルを設定

まず「①フォームのタイトル(必須)」を入力、
ここでは「お問い合わせフォーム」と入力しましょう。

次に必要に応じて「②フォームの説明(任意)」を入力しましょう。

フォームの説明(任意)ですが、ゴジュスタでは
必要事項をご入力の上、「送信」ボタンをクリックしてください。」と入力してあります。

MEMO
Google フォームは自動保存なので、
何もしなくても一定間隔で作業が保存されます。

フォームの質問項目を設定

まずは「お名前入力」を作成しましょう。

フォームの質問項目を設定

まず「①質問項目名」に「お名前」と入力しましょう。

次に「②質問の種類」を選択しましょう。

質問の種類を設定

メニューが表示されたら一番上の「記述式」を選択しましょう。

右下の「必須」のスイッチを右へ!これでこの質問が「入力が必須」の項目に!

❹最後に右下の「必須」のスイッチを右へ!
これでこの質問が「入力が必須」の項目になります。

MEMO
「入力が必須」の項目は、入力しない限り「送信」することができません。

質問項目を追加

さあ!同じ手順で下記の3項目を追加していきましょう!

  • 会社名(必須ではない)
  • メールアドレス(必須項目)
  • 件名(必須項目)

「会社名」は法人の方だけが入力する項目なので、
「入力が必須」にはしないでください。

質問項目を追加

プラス(+)ボタンをクリックすると、質問を追加できます。

プラス(+)ボタンをクリックすると、質問を追加できます

「お問い合わせ内容」を設定

最後に「お問い合わせ内容」を設定しましょう。

「お問い合わせ内容」は長文を入力できるようにしなければなりません。

今まで「質問の種類」「記述式」を選択してきましたが、
「記述式」は1行だけを入力させる項目です。

長文を入力させる場合は、「段落」を選択してください。

長文を入力させる場合は、「段落」を選択してください

これで質問項目の設定が完了しました。

【これ絶対!】フォームが送信されたらメールでお知らせ機能

出来上がったお問い合わせフォームをブログに埋め込む前に、
あと一つやっておきたい設定があります。

詳しい方でも案外知らないようなので、ぜひ覚えて下さい!

マーくん

Googleフォームはデフォルトの設定のままだと、
誰かがフォームからお問い合わせをしても、メールなどで教えてくれません!

Googleドライブにデータは蓄積されているのですが、
自分からいちいちチェックするのは面倒 (^^;

そこでこの設定!

まず回答ボタンをクリックして、回答画面に切り替えます。

回答ボタンをクリックして、回答画面に切り替えます

回答画面というのは、お問い合わせフォームから送られてきた内容を確認できる画面のことです。

現在はお問い合わせが無いので「0件の回答」になっています。

お問い合わせが無い場合は「0件の回答」と表示されます

回答画面の右上にあるアイコンをクリック

回答画面の右上にあるアイコンをクリック

メニューが表示されたら
「新しい回答についてのメール通知を受け取る」を選択

「新しい回答についてのメール通知を受け取る」を選択

チェックがついたらメールでお知らせ機能の設定完了です!

チェックがついたらメールでお知らせ機能の設定完了

ブログ(Wordpress)に埋め込もう!

さあ!いよいよご自身のブログ(Wordpress)に埋め込んでいきましょう!

マーくん

実は埋め込み方法でちょっと悩みました (-_-;)
なぜ「送信」ボタン???

ココ!分かりにくいのですが、「送信」ボタンをクリックして下さい。

「送信」ボタンをクリック

次に < > アイコンをクリック!

< >という形の アイコンをクリック!

埋め込むコードが表示されましたね!

難しいことは置いといて大丈夫です (*^^*)

迷わずコピーををクリックして下さい。
これで一旦PCにコピー(ctrl + P)されました。

埋め込むコードが表示されたらコピーします

ここからは、ご自身のブログ(Wordpress)にログインしましょう!

マーくん

あと少しです!
  1. ダッシュボードで固定ページを選択
    お問い合わせページを新規作成して下さい。
  2. エディタ(例はClassic Editor)で「テキスト」を選択。
  3. さっきコピーしたコードをペースト(ctrl + V)して完了!

さっきコピーしたコードをペースト(ctrl + V)して完了!

プレビューするとこんな感じ、
完成です!

完成したお問い合わせのプレビュー画面

まとめ

どうです?
ご自身のブログに設置するところまでうまくいきましたか?

ブログに設置しただけで安心しないで、必ずテストで送信してみて下さいね。

マーくん

お問い合わせフォームを作ったら、送信テストは必須です!

送信されたデータは、先ほどの回答画面で確認できますし、
CSV形式でダウンロードすることもできます。