GoogleフォームでGoogle Apps Scriptを使って自動メール送信機能のついたお問合せフォームを作成してみた

2016年2月26日2020年1月23日ちゃんなる Web制作

さくっとお問合せフォームを作りたい時に。

Googleフォームが便利です。もともとはアンケートフォームなのですが、Google Apps Scriptを使うことによって自動メール送信も可能。

1ページのランディングページしかないサイトとか、ちょっと申し込みフォームが必要な時とか・・・使える！

早速手順いきます。

Googleフォームでフォームを作成

→Googleフォーム

右下の「＋」から、追加します。

直感的に項目を追加できます。

テーマも選べたりカスタマイズできます。

最近UIが新しくなってから、全部アイコンになったのでわかりにくいかも。

一応説明入れておきますね〜。

Google Apps Scriptを使って自動メール送信機能を追加

上記の手順までで、フォームとして完結できるのですが、いちいちGoogleフォームにアクセスして「回答」をチェックしなくちゃいけません。。

締切を決めているアンケートとかだったら、それで良いのですが、こちとらお問合せフォームを作りたいわけなので、気まぐれ返信ではいけませんよね！

そこで、フォームにお問合せが送信されたら、メールを自動で飛ばすようにしたいと思います〜。

右上の「その他」ボタンから、「スクリプトエディタ」を選択。

無題のプロジェクトが作成されます。

元々入力されている↓空の関数は削除して、こちらをコピペ！

function submitForm(e){ 
  var itemResponses = e.response.getItemResponses(); 
  var message = '';
   
  for (var i = 0; i < itemResponses.length; i++) { 
    var itemResponse = itemResponses[i]; 
    var question = itemResponse.getItem().getTitle(); 
    var answer = itemResponse.getResponse(); 
     
    if (question == '氏名'){
      var username = answer;
    }
    if (question == 'メールアドレス'){
      var usermail = answer;
    }
     
    message += (i + 1).toString() + '. ' + question + ': ' + answer + '¥n'; 
  } 
   
   
  /* 管理者宛メール送信設定 */
  var address = 'kanrisha@example.com'; 
  var title = '[やってみたら、できた。へのお問合せを受信しました]'; 
  var content = '下記の内容で、お問合せを受信しました。¥n¥n'
  + message
  + '¥n¥n'
  + '※このメールはGoogleフォームからの自動送信メールです。'; 
  var options = {from: 'kanrisha@example.com', bcc: 'bcc@example.com', name: 'やってみたら、できた。お問合せフォーム', replyTo: usermail};
 
  GmailApp.sendEmail(address, title, content, options);
   
   
  /* ユーザー宛メール送信設定 */
  var title2 = '[やってみたら、できた。へのお問合せを受付けました]'; 
  var content2 = username 
  + ' 様¥n¥n'
  + 'この度は、お問合せいただき、ありがとうございます。¥n'
  + '下記の内容で、受付けました。¥n'
  + '後ほど折り返しご連絡させていただきますので、いましばらくお待ちください。¥n¥n'
  + message 
  + '¥n¥n'
  + '----------¥n'
  + 'やってみたら、できた。¥n'
  + 'https://narugaro.wordpress.com'
  + '¥n¥n※このメールはGoogleフォームからの自動送信メールです。'; 
  var options2 = {from: 'kanrisha@example.com', name: 'やってみたら、できた。お問合せフォーム'};
 
  GmailApp.sendEmail(usermail, title2, content2, options2); 
           
}

はい。

ご自分の環境に合わせて変更してくださいね。

管理者宛メール

管理者宛メールの送信先はaddress：kanrisha@example.com
titleに件名を。
bccで他のアドレスにも送りたい時：bcc@example.com
メールの送信元はfrom：kanrisha@example.com
name部分はメーラーで表示される送信元の名前。
管理者宛にきたメールに返信したらユーザーさんへのメールが立ち上がるようにreplyTo

ユーザー宛メール

title2に件名。
content2は本文。
署名もつけてます。
fromにメールの送信元アドレス
nameは送信元の名前。

続いてはメールを「いつ」送信するか（トリガー）を設定します。

スクリプトエディタのメニュー「リソース」から、「現在のプロジェクトのトリガー」をクリック。

フォーム送信時にして保存してください！

送信元をGoogleアカウントじゃないメールアドレスにする

これでOK、、ではないんですね〜。

上の設定部分で、送信元fromを設定していましたが、これがデフォルトじゃできないんです。

デフォルトでは、送信元はそのGoogleフォームを作成したGoogleアカウントのメールアドレスになります。

それでいいって人はそのままでもいいんですが、Gmailアドレスバレるの嫌だから変更したいよって場合！

これはGmailの方の設定になります。

Gmailを開いて、設定から「アカウントとインポート」タブへ。

「メールアドレスの追加」をクリックします。小さい黄色い画面が開きます。

追加したいメールアドレスを入力して、次へ！

送信サーバーと、パスワードを入力して次へ！（うまくいかない時はプロパイダのメール設定を見てね。）

メールで確認コードが送られてくるので、それを入力してください。

メールアドレスが増えました！

これで、先ほどのGoogle Apps Scriptが動くようになります！

no-reply@とかメールアドレスを作って設定するもよし、ですね。

2016年11月7日追記
apps-scripts-notifications@google.comから「その操作を実行するには承認が必要です。」というエラーが返ってきていて、使えなくなっていたのですが本日復旧しました。

原因は、たぶん色々なGoogleアカウントを使っていたからトリガーが曖昧になってしまった、ことでしょうか。
トリガーを作り変えて承認をし直したところ、なおりました。