独自ドメインのコンタクトフォームを作ったときの備忘録

CMSのプラグイン使うのも面倒くさかったし、GAS使えば簡単にできそうだったから。
また、タダでいけそうだったので、独自ドメインのメールサーバーにZohoを使用した。

やった流れ

1. Zoho mailの設定
2. Gmailの設定
3. フォームの作成

1. Zoho mailの設定

1. 独自ドメインを用意する(私はお名前.comを使った)
2. DNSサーバーを用意する(私はお名前.comを使った)
3. Zoho mailの案内に従ってメールサーバー(独自ドメイン)の設定する
4. Zoho mailの管理画面からPOP3とSMTPプロトコルを使用可能に設定する

2. Gmailの設定

1. Googleアカウントを用意する
2. Gmailにアカウントを追加する
3. Zohoのドキュメントを見てPOP3とSMTPの設定をする
4. Aliasに登録をする(これをシないとGASから送信できなかったので注意)

3. フォームの作成

1. Google Formを作る
2. Google Formに紐づくSpreadsheetを作る
3. Spreadsheetに紐づくGASプロジェクトを作る
4. HTMLテンプレートをGASプロジェクトに作る
5. GASでメールの送信処理を書く(autoreply.gs)
6. GASのトリガー（フォーム送信時）を設定する

autoreply.gs

~~ 省略 ~~
  html = HtmlService.createHtmlOutputFromFile("template").getContent();
  GmailApp.sendEmail( // MailAppではなくGmailAppを使用する
    to,
    subject,
    textBody, // textメール用 
    {
      htmlBody: html, // htmlメールができる場合はtextBodyが上書きされる
      from: from,
      name: name,
    }
  );

References

http://www.workabroad.jp/tech/559
https://www.zoho.com/mail/help/pop-access.html
https://www.zoho.com/mail/help/zoho-smtp.html
https://developers.google.com/apps-script/guides/html/