WordPressサイトのフォーム送信時にSMSやWhatsAppメッセージを送信したいですか？WPForms Twilioアドオンを使えば、フォーム送信完了時にSMSやWhatsAppの通知を自動送信できます。
このチュートリアルでは、WPFormsにTwilioアドオンをインストールして使用する方法を紹介します。
必要条件
- Twilioアドオンにアクセスするには、Plusライセンスレベル以上が必要です。
- Twilioアドオンに必要な最低バージョンを満たすように、WPFormsの最新バージョンをインストールしたことを確認する。
Twilio アカウントの設定
WPFormsでTwilioアドオンを設定する前に、Twilioアカウントを作成して設定する必要があります。このプロセスでは、アカウントの作成、本人確認、メッセージ送信用の電話番号の取得を行います。すでにTwilioアカウントを設定している場合は、「WPFormsとTwilioの接続」のセクションに進んでください。
まず、Twilioのウェブサイトにアクセスし、アカウントを作成します。アカウントを作成するには、いくつかの基本情報が必要です。
サインアップ後、Twilioはアカウント設定プロセスを案内します。これには、認証コードを受け取るための電話番号による本人確認が含まれます。電話番号を入力すると、TwilioからSMSでコードが送信されます。
認証コードを入力すると、Twilio Consoleのダッシュボードが表示されます。ここにはTwilioとWPFormsを統合するために必要なすべてのツールと設定があります。
Twilio電話番号の購入
WPFormsインテグレーションを通してメッセージを送信するには、専用のTwilio電話番号を購入する必要があります。Twilio Consoleで、左のナビゲーションメニューから電話番号 " 管理 " 番号を購入.
ここでは、利用可能な電話番号を検索するためのオプションが表示されます。ページ上部の検索オプションを使って、特定の市外局番や番号パターンを検索することができます。
適当な番号が見つかったら、その横にある購入 ボタンをクリックする。
確認ウィンドウが表示され、番号の機能と月額料金が表示されます。購入] をクリックして購入を完了します。無料トライアル期間中、Twilioは15ドルのクレジットを提供し、このクレジットを使って電話番号を購入し、メッセージを送信することができます。
Twilioでの電話番号の検索と購入に関する包括的な詳細については、Twilioの公式ガイドを参照してください。
メッセージ・テンプレートの作成
メッセージテンプレートでWhatsApp通知を標準化し、フォーム送信データを含めることでよりダイナミックな通知にすることができます。フォームフィールドの情報を自動的に挿入するテンプレートを作成できます。
メッセージテンプレートを設定するには、Twilioコンソールの左サイドバーメニューから、メッセージング " コンテンツテンプレートビルダーに進みます。
次に、最初のコンテンツテンプレートを作成するボタンをクリックします。
ボタンをクリックすると、テンプレート作成フォームが表示され、いくつかの重要な情報を入力する必要があります：
- テンプレート名：テンプレートの目的を明確に示す説明的な名前を入力します。このフィールドには、小文字の英数字とアンダースコアのみを入力できます。
- テンプレートの言語：利用可能なオプションからメッセージに使用する言語を選択します。
- コンテンツの種類:このフィールドには、メッセージをフォーマットするためのさまざまなオプションが表示されます。シンプルなテキストメッセージを送りたいのか、メディアを含めたいのか、インタラクティブな要素を加えたいのか、より構造化されたレイアウトを作りたいのか、ニーズに応じて最適なタイプを選択してください。
- この例では、テキスト・コンテンツ・タイプを選択します。
これらの詳細を追加したら、Create ボタンをクリックして次のステップに進みます。
次に、テンプレートの設定ページに移動します。ここでは、テンプレートの内容をカスタマイズするためのオプションが表示されます。コンテンツ」セクションまでスクロールダウンし、「本文 」フィールドにメッセージのテキストを入力します。
メッセージをダイナミックにするには、変数を追加して、メッセージ送信時に実際のフォームデータに置き換えることができます。変数を追加するには、Bodyフィールドの下にあるAdd Variable ボタン（ ）をクリックします。
変数には、数字と一緒に二重中括弧を使用します：「こんにちは {{1}}!ご注文番号ありがとうございます {{2}}."
メッセージ入力後、[保存]をクリックし、WhatsApp承認のため送信してください。
ポップアップウィンドウが表示されますので、各変数のサンプル値を入力してください。これらのサンプル値はWhatsAppがテンプレートの使用方法を理解するのに役立ちます。
各変数に適切なサンプルテキストを入力し、[Save with samples]をクリックしてテンプレートの作成プロセスを完了します。
メッセージテンプレートの作成、フォーマットオプション、ベストプラクティスの詳細についてはTwilio公式ガイドをご参照下さい。
WPFormsとTwilioの接続
WPFormsのコアプラグインが配置され、ライセンスが確認されたら、Twilioアドオンをインストールし、有効化します。
TwilioアカウントとWPFormsを接続するには、WPForms " Settingsにアクセスし、Integrations タブをクリックします。
次に、 Twilio オプションをクリックして、設定を展開します。 ここから、[新しいアカウントを追加]ボタンをクリックします。
Twilio Account SIDとAuth Token、そしてアカウントのニックネームを追加する2つのフィールドが表示されます。
このブラウザーのタブは開いたままにしておく。
Twilio クレデンシャルにアクセスする
認証情報を確認するには、まずTwilioコンソールにログインしてください。ログインしたら、ダッシュボードのアカウント情報セクションを探します。
このセクションには、アカウントSIDと 認証トークンという2つの重要な情報が含まれています。コピーアイコンをクリックして、両方の認証情報をコピーしてください。
WPFormsへのTwilio認証情報の追加
アカウントSIDキーをコピーしたら、WPFormsを開いたブラウザタブに戻り、コピーしたキーをTwilioアカウントSID フィールドにペーストします。
同様に、TwilioからAuth Tokenをコピーし、Twilio Auth Tokenフィールドにペーストする必要があります。
次に、Twilioアカウント名フィールドにニックネームを追加します。これは内部的に参照するためだけのもので、後で追加のTwilioアカウントを接続する場合に役立ちます。
準備ができたら、[Twilioに接続]ボタンをクリックします。
WPFormsがあなたのサイトをTwilioアカウントに接続します。接続が完了すると、Twilio統合の横に緑色の「接続済み」 ステータスが表示されます。
フォームでTwilioを使う
WPFormsとTwilioアカウントの接続が完了したら、Twilioとフォームをリンクします。これを行うには、まず新しいフォームを作成するか、既存のフォームを編集してフォームビルダーにアクセスする必要があります。
フォームビルダーで、Marketing " Twilioに進みます。そして、[新しい接続を追加]ボタンをクリックします。
次に、接続ニックネームを入力するオーバーレイが表示されます。このニックネームはユーザーには表示されませんので、ご自由にお使いください。ニックネームを追加したら、OKボタンをクリックしてください。
接続先の名前を決めたら、[アカウントの選択]ドロップダウンから接続先のアカウントを選択する必要があります。
アカウントを選択すると、いくつかの設定オプションが表示されます。
名前を付けて送信
通知の送信方法を選択してください。SMSか WhatsAppのどちらかをお選び下さい。ここでの選択により、以下に表示されるオプションが決まります。
送信元
メッセージ送信に使用するTwilio電話番号を選択します。このドロップダウンには、Twilioアカウントで購入したすべての電話番号が表示されます。
送信先
通知を受け取る人を指定します。2つのオプションから選択できます：
- 電話番号：フォーム送信者にメッセージを送信する場合に選択します。
- 認証済み電話番号：Twilioアカウントで確認済みの特定の電話番号に通知を送信する場合に選択します。
電話番号
注：このフィールドは、[送信先]ドロップダウンから[電話番号]が選択されている場合にのみ表示されます。
このドロップダウンから、受信者の電話番号を含むフォームフィールドを選択します。
確認済み電話番号
注：このフィールドは、[送信先]ドロップダウンから[確認済み電話番号]が選択されている場合にのみ表示されます。
このドロップダウンから、Twilioアカウントで確認済みの電話番号のリストから選択します。
メッセージ
このフィールドは、「名前を付けて送信」フィールドでSMSを選択すると表示されます。ここに、送信するテキストを入力します。このフィールドの隣にある「スマートタグを表示」ボタンをクリックすると、フォームフィールドの値などの動的コンテンツをメッセージに含めることができます。
メッセージテンプレート
WhatsAppを 選択した場合、このフィールドが表示されます。ここで、メッセージテンプレートセクションで作成したテンプレートのいずれかを選択します。これはWhatsAppビジネスメッセージに準拠するために必要です。
テンプレート変数
変数を含むWhatsAppメッセージテンプレートを選択すると、テンプレート変数セクションが表示されます。ここでフォームフィールドをテンプレート内の変数にマッピングできます。
テンプレート内の各変数に対して、対応するドロップダウンが表示され、メッセージ送信時にその変数を置き換えるフォームフィールド値を選択できます。
例えば、テンプレート・メッセージが "Hello "の場合 {{1}}!ご注文番号ありがとうございます {{2}}"、そうだろう：
- 変数1を顧客の名前を含むフォーム・フィールドにマップする。
- 変数2を注文番号を含むフォームフィールドにマッピングする。
このマッピングにより、WhatsAppメッセージにフォーム送信の正しい情報が自動的に含まれるようになります。
フォームの Twilio 接続の設定が完了したら、フォームビルダーの上部にあるSaveをクリックします。
WhatsApp テストのサンドボックス有効化 (オプション)
WhatsApp Businessアカウントを開設する前にWhatsAppメッセージングをテストしたい場合、TwilioのSandbox環境をご利用ください。WhatsAppの承認を得ることなく、インテグレーションをテストすることができます。
そのためには、お客様の電話番号を Twilio WhatsApp Sandbox に接続する必要があります。これを行うには、Twilio コンソールにログインし、左サイドバーからメッセージング " 試してみる " WhatsAppメッセージを送信を選択します。
WhatsAppのテストページで下記までスクロールして下さい。 WhatsApp Sandboxに接続 セクションに、Twilioの電話番号を含む、あなた独自のSandbox接続の詳細が表示されます。 (+14155238886) と参加コードが必要です。WhatsAppでこの番号に参加コードを送信するか、携帯電話のWhatsAppアプリでページに表示されているQRコードをスキャンすることで、サンドボックスに接続できます。
参加コードを送信すると、あなたの電話番号がサンドボックスに接続され、テストの準備ができたことを示す確認メッセージが届きます。
電話番号を Twilio Sandbox に接続したら、WPForms で使用するように設定します。フォームビルダーでフォームを開き、Twilioの接続設定を開き、送信方法のドロップダウンでWhatsAppを 選択し、サンドボックスモードを有効にするオプションを表示します。
このオプションを有効にすると、WhatsAppメッセージの処理方法が変更されます。事前に承認されたメッセージテンプレートが必要となる代わりに、メッセージ フィールドが表示され、使用したいカスタムテキストを入力できます。
アドオンは、Twilioのテスト番号を使ってメッセージを送信します。 (+14155238886)WhatsApp BusinessアカウントがなくてもWhatsAppとの統合をテストできます。
サンドボックスモードを有効にし、メッセージフィールドにメッセージテキストを設定した後、フォームを保存することを忘れないでください。
条件ロジックの設定（オプション）
条件付きロジックを使うと、フォームでのユーザーの選択に基づいてアクションを実行するかどうかを選択することができます。例として、SMSとWhatsAppの2つのTwilio接続を作成し、ユーザーの希望する通知方法でメッセージを送信する条件付きロジックの使い方を紹介します。
この設定を行うには、まず上記の手順で2つのTwilio接続を作成する必要があります。一つは SMS メッセージ送信用に、もう一つは WhatsApp メッセージ送信用に設定します。
次に、フォームに複数選択肢フィールドを追加します。この例では、ラベルを「どのように通知されたいですか」と設定し、2つの選択肢を追加します：SMSと WhatsAppです。
次に、フォームビルダーのMarketing " Twilioに行き、Enable Conditional Logicオプションを切り替えます。次に、条件付きロジックのルールを設定します。
SMS接続では、ルールを次のように設定する：通知方法が SMSの場合、この接続を処理する 。
WhatsApp接続の場合、以下のように設定します：WhatsApp接続の場合、「 通知方法」が「WhatsApp」の場合、この接続を処理 します。
最後に、条件ロジックを適用するために必ずフォームを保存してください。
この設定により、ユーザーがフォームに入力すると、フォームで選択した内容に応じて、SMSかWhatsAppのどちらか希望の方法で自動的に通知が届きます。
よくある質問
以下に、Twilioアドオンに関するよくある質問にお答えします。
サンドボックスモードでWhatsAppメッセージが使えなくなったのはなぜですか?
サンドボックスモードでWhatsAppメッセージをテストする場合、最初に電話番号を接続してから3日間のテスト期間があります。この期間が過ぎるとメッセージは送信されなくなります。テストを継続するには、上記「WhatsAppテスト用サンドボックスの有効化」の手順に従ってサンドボックスに再接続して下さい。
メッセージの配信状況やログを見ることはできますか？
はい、WPFormsとTwilio Consoleの両方でメッセージのステータスとログを追跡できます。
WPForms内では、WPForms " Toolsから Logsタブを開いて直接メッセージの配信状況やログを見ることができます。
WPFormsのロギングの詳細については、アクティビティロギングを有効にする方法のガイドを参照してください。
さらに、Twilioコンソールで、 Monitor " Logs " Programmable Messagingに進み、配信ステータス、タイムスタンプ、コンテンツ、受信者情報、エラーなどの詳細なメッセージングログを表示します。
メッセージングログの詳細については、Twilioのメッセージングログに関する公式ガイドを参照してください。
以上です！TwilioアドオンをWPFormsにインストールして使う方法を紹介しました。
次に、スパム送信を防ぐために、フォームにCAPTCHAを追加したいとお考えですか？詳しくはチュートリアルのCAPTCHAの選び方をご覧ください。