wordpress予約管理システムameliaとgoogle spreadsheetの連携方法を図解！

wordpress予約システムプラグインamelia(amelia公式サイトへリンクしています)のwebhook機能を利用して、wordpressからの予約をスプレッドシートの管理にチャレンジしたいと思います！

前回、公式ドキュメントに紹介されていたZapierと連携と取り、google spreadsheetへ予約データを格納しようとした所、Zapierのwebhooks機能は有料会員にならないと使えないという事が判明。

絶対にspreadsheetで予約データを自動保存する！という意気込みでリサーチをして出来るようになりました。

webhookを利用

webhookって何？と思われる方はとても多いと思います。私も最近webhookを理解して使い方をマスターしました。

無料でwebhookをZapierのように扱えるサービスを発見しました。

Pabbly

英語での解説しか出てこなかったのですが、今までの経験と類似の事例を参考に独自にameliaとの接続に成功しました！

この技術は、最近LINE Developerツールを自由に操れるようになりたいと入校したプロトアウトスタジオでの勉強の成果。ゼロから技術者の自己満足でサービスを作るのではなく、既存のサービスを組合わせて、早く楽に新しいサービスを作る。プロトアウトの技術です。

技術を知っていないと、既存のサービスを組わせられないので、技術を猛勉強中。その中で習得した技術を組合わせるために必須となるwebhookやAPIへの知見。最近、成果が表れているなと実感する事がとても増えてきました！

Pabblyへログイン

googleのアカウントでログインしました。

ログインをするとこのような画面へ切り替わるので、【Connect】にあるAccess Nowをクリック。

アカウント作成した直後では、connect errorが何度が出ました。他のEmail Marketing等をクリックしたり行き来している間に表示されるようになりました。

Create Workflow

新しいワークフローを作成します。

Workflowに名前をつける

何のワークフローなのか識別するための名前を付けます。これは、管理画面で表示される名前です。私の場合は【Amelia_R】と名前を付けました。

何と接続するのか選択

最初にやる事は、Triggerの設定。何と接続するのかという部分です。

【Webhook】を選択してください。ZapierではWebhooksは有料だったので本当に嬉しい。

Webhook URLをコピーしてAmeilaに入力します。

Ameliaの管理画面でwebhook URL入力

【設定】＞【Integrations】をクリックします。

【Add New Web Hook】

必要事項を入力

1. 名前　-　なんでも大丈夫です。何と接続しているかわからなくならないようにPabblyと付けました。
2. URL　-　こちらに先ほどコピーしたWebhookURLを貼り付けます。
3. 種類 　-　予定（サービス）かeventどちらの情報を受け取るか設定します。
4. Action　-　どのタイミングで値を受け取るか設定します。今回はBooking Completed。予約した時になります。

サービスの予約かイベントの予約かどちらかしか選べないので、サービスで１つ接続、同じ工程でイベントを接続と、両方のデータを受け取りたかった場合はwebhookを2個設定する必要があります。

最後に保存を忘れずにクリックしてください。

Pabblyへ戻り、Capture Webhook Responseをクリック

きちんとAmeliaからデータを受け取る事が出来るか確認をします。

【Capture Webhook Response】をクリックしている間に、実際に予約を行ってください。アクションを起こしてデータを受け取ります。

データを受け取れたら【save】

データが受け取れると一覧で表示されます。左が変数。右が実際の値になります。

Triggerの後、何をするかを設定

Ameliaからデータを受け取った後、何をするか設定します。今回はgoogle spreadsheetへデータを格納するので、Choose Appでgoogle shpreadsheetを検索します。

Google Sheetsを選択すると、Action Eventの選択画面が出てくるので今回は【Add New Row】新しい行を追加にしました。

事前にgoogle spreadsheetを作成

事前にgoogle spreadsheetを作成しておいてください。また、1行目に受け取りたい値の見出しとなる文章を付けておいてください。

google spreadsheetと接続

【Connetct With Google Sheets】をクリック。

spreadsheetを作成したgoogleのアカウントと接続します。

1. Spreadsheet ー ファイル名を選択します。この画面を表示させた後に新しく作成した場合はRefreshをクリックすると反映されて選べるようになります。
2. Sheet ー シート名を選択します。

1行名に書いた見出しが読み込まれます。

Ameliaとスプレッドシートの紐づけ

例えばspreadsheetに書いた姓の列をAmelia姓と紐づけます。

右の3本線をクリック

展開された項目から姓の欄を見てけ、選択します。このように、値を受け取りたい項目を紐づけていきます。

保存をして接続完了！

【Save & Send Test Request】をクリックして接続完了。

これで、Ameliaから予約が入ったらgoogle spreadsheetに自動でデータが入ってきます。

仕組み作りについて

予約が完了した時にスプレッドシートへ追加というアクションなので、キャンセルした時、日程変更した時には動きません。

キャンセル用のシートを作成して、キャンセルがあった時のアクションを記録。日程変更用のシートを作成して、日程変更があった時のアクションを記録。数種類のworkflowを作成する必要があるなと思っています。

無料相談随時受け付けております。