ブログ

Googleフォームの自動返信機能を追加する(前編)

Google-auto-mail-return-8

こんにちは、フロントエンドエンジニアのかみーゆです。

書き初めしたり、カレー食べたりしてばかりだと思われるとなんなので、たまにはエンジニアらしいことを書いてみようと思います。
最近、Googleフォームの自動返信を実装したので、その方法を二回に分けてご紹介します。

今回はその前編です。

使うのはGoogleフォーム、その結果を集計するスプレッドーシート、Google Apps Scriptです。

Google Apps Scriptってなんぞ?

Google Apps Script(通称GAS)は、Googleが提供するサービス上でさらにクラウドでスクリプトを実行することで操作できるサービスです。スクリプトの言語は、JavaScriptをベースです。サーバーサイドで実行されます。
ただしJavaScriptをベースにしていますがJavaScriptの全ての組み込み関数を使えるわけではないので注意が必要です。

Googleフォームを作る

GoogleフォームはGoogleアカウントがあれば誰でも使えるサービスです。
サインインして、Googleフォームを新規で作成します。

google_form01

右上設定(歯車マーク)を開きます。
メールアドレスを収集するにチェックし、メールアドレス登録を必須項目にします。

こうすると、バリデートも勝手にしてくれるので楽チンです。
そのほかの設定も適宜すれば完了です。

ユーザーを限定するなどの不要な項目のチェックは外しておくと良いですよ。

google_form02

そのあと、お問い合わせ項目を追加していきます。

フォームタイトル、詳細なども変更したい部分をクリックして編集できます。

ラジオボタンやチェックボックスなども追加できます。
今回はわかりやすく今回は「お名前」と入力できる項目を追加してみました。

google_form03

フォーム回答終了後のメッセージはデフォルトでは「回答を記録しました」です。
こちらも右上設定(歯車マーク)からこうできます。
ポップアップが開いたらプレゼンテーションを選んで「確認メッセージ」を変更します。

google_form04

これでフォームの準備はできましたね。
右上送信からフォームページのリンクやiframeの埋め込みタグなどを取得できます。

デザインのカスタマイズなどは割愛します。右上パレットマークをクリックして色々試してみてください。

集計するためのGoogleスプレッドシートを作成

GoogleスプレッドシートはWeb上で使えるエクセルのようなものです。
今回作るGoogleスプレッドシートはGoogleフォームから回答の送信があるたびに連動して自動更新されます。

この集計用のGoogleスプレッドシートも簡単に作れます。

回答の右上スプレッドシートマークをクリック。
Googleスプレッドシート名を適当につけます。

google_form09

ここまでは楽勝でしたね!
次回はGoogleフォームの自動返信機能を追加する(後編)でスプレッドシートの細かい設定やGoogle Apps Scriptについてご紹介します!!

 

■この記事を書いた人 かみーゆ(フロントエンドエンジニア)

CMS concrete5の認定エバンジェリスト。コーディングからプログラミングまでフロント周りを中心にお仕事してます。広島支社でフロントエンドからサーバエンドまで幅広く触れるリベロなエンジニアを目指してます。お得意のconcrete5や技術的なTipsの記事を主にUPしてます。好きなものは肉とビール。

関連記事

  1. hpseisaku ホームページ制作を依頼する時のポイント
  2. blog_cms-01 初心者がWordPressを使ったら良くも悪くも”ブログ形式”に…
  3. color-12 イラレのイラストに自然な陰影を与える配色のコツ
  4. hpseisaku ホームページの健康診断してみませんか?
  5. blog_image_WP 最近気になるVCCWを使ってみた
  6. How-to-make-ribbon-in-Illustrator-8 【初心者向け】イラレでリボン作成 ワープで簡単変形!
  7. How-to-make-text-decoration-8 フチ付き文字の作り方-チラシやLP制作に使える派手なイラレ文字装…
  8. shortcut_repeat-copy2 IllustratorのショートカットコンボをPhotoshop…

最近の記事

  1. IMG_1781
  2. Hirofuro-logo-8
  3. eyecatch7-1
  4. SEO-eyecatch
  5. wtm100
PAGE TOP