WordPressで構築したフォームからTwilio SendGridを使ってメール送信する方法
- 2024年3月14日
- by 青木大将
- Category: 技術ネタ
WebサイトやWebサービスの運営において、メールの送信機能は不可欠です。例えばWebサイトでは、フォームから問い合わせをした場合などに自動応答メールが送信されるのが一般的ですし、ECサイトにおいても、会員登録や購入完了のお知らせ、パスワードリセットなど多くの場面でメールが利用されています。
昨今では、CMSを利用することでWebサイトを簡単に構築できるようになりました。代表的なCMSであるWordPressにもメール送信機能はあり、標準でインストールされたメールサーバ経由で送信が可能です。しかしこの場合、メールサーバの設定を全て自身で行う必要があり、メンテナンスも継続して行わなければなりません。送信者認証を正しく設定できていなければ、宛先からスパム送信者と判断されメールの到達率が低下する恐れもあります。
このような課題を解決するためには、Twilio SendGridの利用をお勧めします。
SendGridを中継させることでサーバのメンテナンスが不要になるだけでなく、到達率を向上させるための様々な機能を利用することができます。
今回は、世界で多く利用されているWordPressとそのプラグイン「WP Mail SMTP」、「Contact Form 7」を組み合わせて、SendGridを経由したメールを送信する手順をご紹介します。
今回行うこと
WP Mail SMTPでは、WordPressと外部のSMTPサービスとの連携を簡単に実現することができます。このプラグインを使い、SendGridと連携してメール送信します。
Webフォームの構築には、Contact Form 7を使用します。
フォームに問い合わせてからメールが届くまでの流れは以下の通りです。
①ユーザがフォームから問い合わせる
②WP Mail SMTPを介してメールの送信リクエストがSendGridに送られる
③以下の2種類のメールが送信される
（管理者宛）問い合わせが来たことを知らせる通知メール
（ユーザ宛）問い合わせが受理された旨を知らせる自動返信メール
設定手順
1. SendGridでメール送信の設定を行う
Domain Authenticationを設定する
まずは、送信元ドメインの設定を行いましょう。
チュートリアルを参考に、Domain Authentication（SPF/DKIM設定）を行ってください。ここで設定したドメイン（例：emXXXX.example.com）は、手順3のWP Mail SMTPの設定でも使用します。
APIキーを発行する
SendGridでメール送信するにはAPIキーが必要となります。チュートリアルを参考にAPIキーを発行しましょう。
※発行するAPIキーには、「Mail Send」のFull Access権限を付与してください。
2. WordPressにプラグイン「WP Mail SMTP」を追加する
WordPressの「プラグイン > 新規追加」画面からプラグイン「WP Mail SMTP」を追加してください。
3. WP Mail SMTPの送信設定を行う
WP Mail SMTPからSendGird経由でメール送信するための設定を行います。
「インストール済みプラグイン」メニューを選択し、以下のようにWP Mail SMTPを有効化してください。
続いて表示される「設定」をクリックすると、設定画面に遷移します。
「一般」タブを選択し、画面を下にスクロールしてください。
フォームで使用する送信元メールアドレスの設定をします。
今回は、Domain Authenticationを設定したドメインからのみメールを送信するよう設定します。「送信元メールアドレス」欄に手順1で設定したドメインのメールアドレスを入力し、「このメールを強制使用」にチェックを入れましょう。
「このメールを強制使用」を有効にすると、WordPressから送られる全てのメールの送信元にこのメールアドレスが設定されます（他のプラグインでの変更は効かなくなります）。
WP Mail SMTPの公式ドキュメントでも、本項目を有効にすることが推奨されています。ぜひチェックを入れておきましょう。
続いて、「フォーム名」欄にメールの差出人名を入力します。
メーラーは「SendGrid」を選択します。
手順1で発行したAPIキーとDomain Authenticationを設定したドメインを以下の通り入力します。
送信設定は以上です。「設定を保存」ボタンをクリックしましょう。
4. Contact Form 7で問い合わせフォームを作成する
最後に、問い合わせフォームを作成しましょう。
フォームを構築する
WordPress管理画面の「お問い合わせ」メニューを選択し、表示される画面の「新規追加」ボタンをクリックします。
編集画面が表示されるので、フォーム内に配置する部品やフォームタイトルを設定します。
メールテンプレートを作成する
ユーザがフォームから問い合わせをした時に送信される2種類のメールの本文やヘッダの内容をテンプレートとして設定します。
管理者宛の通知メール
「メール」タブを選択すると、以下の編集画面が表示されます。
問い合わせフォーム内で使用しているタグ（例：[your-name]）を配置すると、タグの部分がフォームで入力された内容に置換されるようになります。
ユーザ宛の自動返信メール
「メール (2) を使用」にチェックを入れます。
以下の内容を入力してください。HTMLメールを送信したい場合は「HTML 形式のメールを使用する」にチェックを入れましょう。
メールテンプレートの設定は以上です。「保存」ボタンを押してください。
作成したフォームを公開する
フォームを公開し、表示内容を確認しましょう。「お問い合わせ」メニューから以下の画面を開き、先ほど作成したフォームのショートコードをコピーしてください。
「固定ページ」メニューを選択し、「新規追加」ボタンをクリックします。
続いて表示される固定ページの編集画面にて、先ほどのショートコードをペーストします。
Contact Form 7のブロックが表示されるので、先ほど作成したフォームを選択します。
画面右上の「公開」ボタンから固定ページを公開します。
「固定ページを表示」ボタンを押すと、作成したフォームが表示されます。
以下のようにページが表示されれば設定は完了です。
動作確認
作成したフォームから問い合わせしてみましょう。
必要事項を入力し、「上記の内容で送信する」ボタンをクリックします。
以下のように、フォーム管理者のメールアドレス宛に通知メール、フォームに入力されたメールアドレス宛に自動返信メールがそれぞれ送信されました！
通知メール：
自動返信メール：
さいごに
メール送信プラグイン「WP Mail SMTP」を使って、WordPressで構築したWebフォームからSendGridでメール送信する手順をご紹介しました。これからWebサイトの構築をお考えの方やWordPressからのメールの到達率でお困りの方は今回の記事を参考にしてみてください。
＜参考＞
