ZapierとWorkflow Webhooksを連携させる方法

ユースケースの概要

この設定により、Zapier上の購入後メールワークフローとWorkflow Webhooksが連携され、月次SEO監査のための顧客情報を収集し、Shopify Flowに引き継ぐことが可能になります。

この例では、お客様はアンケートフォーム（ここではGoogleフォームを使用しており、GoogleフォームからGoogleスプレッドシートにデータが追加されます）が添付されたメールを受け取り、以下の項目について回答を求められます：

ShopifyのストアURLは何ですか？
現在、SEOに関して最も大きな課題は何ですか？以下の選択肢から選んでください：slow traffic growth、poor product rankings、thin content、technical errors
お店を経営されてからどれくらいになりますか？ 以下の選択肢から選んでください：less than 6 months、6–12 months、1–3 years、3+ years
ストアでの注文に使用されたメールアドレスは？

お客様がフォームを送信すると、Zapierが回答をWorkflow Webhooksエンドポイントに送信します。その後、Shopify Flowがお客様にタグを付け、メモを追加することで、SEOチームがShopifyの管理画面でその背景情報をすぐに確認できるようになります。

このワークフローの機能

お客様がメールフロー内のフォームを送信すると、データがスプレッドシートに追加され、そこからZapierがデータをWorkflow WebhooksのWebhookに送信し、WebhookがこのペイロードをShopify Flowに送信します：

perl

{
  "name": "Saad",
  "email": "customer@example.com",
  "store_url": "mystore.myshopify.com",
  "challenge_and_store_age": "thin Content | 1-3 years"
}

それでは、Shopify Flowのワークフローは次のようになります：

お客様タグ「seo-audit-pending」を追加します
ストアのURLとSEO上の課題を記載した顧客メモを追加します

これにより、チームはShopifyの管理画面でお客様レコードを簡単に開き、監査が始まる前にどのような点に注意が必要かを確認できるようになります。

動画ガイド

こちらでは、セットアップの全工程を収めた動画をご覧いただけます。動画には音声は入っておりません。必要に応じて、動画の再生速度を速めたり遅くしたりすることができます。

始める前に

Shopifyストアに「Workflow Webhooks」をインストールし、有効にしてください。
「Shopify Flow」のワークフローをご用意いただくか、Shopify Flowで新しいワークフローを作成してください。
Zapierのワークフローにデータを連携させるツールで、入力フォームを作成してください。私はGoogleフォームを使用しており、Googleフォームへの送信が完了すると、Googleスプレッドシートにエントリーが作成されます。 Googleフォームから受け取ったデータをスプレッドシートに反映
Shopify に登録されているとおりに、お客様のメールアドレスを正確に入力してください。そうすることで、Shopify Flowが正しいお客様を識別できるようになります。

接続を設定してください

Workflow Webhooks で、Webhook を作成してください。

名前を入力し、静的トークンを生成してください（次の画像の3番にある「マジックボタン」を押すと、即座に静的トークンを作成できます）。その後、保存してください。

「詳細設定」で、受信したい変数に名前を付けてください：

name
email
store_url
seo_challenge
store_age

設定には4つの変数があり、これらを「name」、「email」、「store_url」、「seo_challenge」にマッピングしています。また、「**カスタムリクエストボディを許可する」**オプションにチェックを入れ、store_ageなどの他の情報も受け取れるようにしています。

Google スプレッドシートのトリガーで、監視したい適切なシートを選択し、フォームにテスト用のエントリを作成して、データを確認してください。

次に、「Webhook by Zapier」アクションを選択し、Workflow Webhooksアプリを使用して作成したWebhookにフォームデータを送信します。アクションイベントで「POST」を選択し、次に進みます。

Workflow Webhooks の Webhook の下部に記載されている手順に従い、マッピングされたフィールド、API トークン、および Webhook の URL を設定してください。

Zapierの「Webhook」アクションで、URLを追加し、ペイロードタイプとして「JSON」を選択し、ヘッダーとデータを次のように追加しました。

その後、取得したデータを使ってテストを行い、公開してください。

その後、ステップを実行し、Zapierから「Workflow Webhooks」アプリのWebhookに送信されたデータをご確認ください。呼び出し履歴では、外部システムがこのWebhookを呼び出したことが確認できるほか、ペイロードも確認できます。このペイロードを「Shopify Flow」で活用して、任意のアクションを実行することができます。

Shopify Flow で、Workflow Webhooks を通じて Webhook データを受信した際に開始されるワークフローを作成してください。その後、Webhook トリガーで「イベントの記録」をクリックしてください。

それでは、先ほど実行した Webhook の呼び出しに戻り、Webhook を再実行して、このペイロードを「Shopify Flow」内の Webhook トリガーに送信してください。

データには、ペイロードとWebhook IDが表示されています。

このWebhookはWebhookダッシュボードでも確認でき、Webhookを特定するために利用できます。

次に、条件を追加します。受信したWebhook IDが、Zapierフロー用に作成したWebhook IDと一致する場合、フォームに関連するアクションを実行するように設定します。これは、すべてのWebhookトリガーが「Workflow Webhooks」アプリ内の任意のWebhook URLに送信されたデータを受信するため、このIDを使用することで、特定の目的に合わせてWebhookから関連するデータを選択できるようになるからです。

「受信メール」の値を使用して、「詳細クエリ」で該当するお客様を検索してください。クエリではメールアドレスを使用できますが、このメールアドレスはWebhookトリガーの変数から取得されたものです。私の場合、fieldTwoがメールアドレスになります。私のクエリは次のようになっています：email:"{{fieldTwo}}"

それでは、そのお客様が存在するかどうかを確認しましょう。お客様IDが存在するかどうかを確認しています。

次に、seo-audit-pendingというタグを追加します。お客様情報を取得するために、設定では、お客様IDを配置する際に以下のコードを使用しました。タグの構文{{-、-}}、{%-、および-%}において、の空白処理機能を使用し、お客様IDの左右にある空白を削除しています。空白が含まれていると、クエリが正常に動作しません。

ruby

{%- for getCustomerData_item in getCustomerData -%}
  {{-getCustomerData_item.id-}}
{%- endfor -%}

顧客メモにストアのURLとSEOに関する課題を追加または更新してください。顧客IDを取得するために、設定では以下のコードを使用して顧客IDを配置しました。の空白文字処理機能（）を、タグ構文{{-、-}}、{%-、および-%}内で使用し、顧客IDの左右にある空白文字を取り除いています。空白文字が含まれていると、クエリが正常に動作しません。

ruby

{%- for getCustomerData_item in getCustomerData -%}
  {{-getCustomerData_item.id-}}
{%- endfor -%}

ワークフローを有効にし、フォームからテスト用のレスポンスを送信して、Shopify内の正しいお客様レコードにタグとメモが反映されることを確認してください。

仕組みは以下の通りです。フォームが送信されると、Zapierがデータを受信し、そのデータをWorkflow WebhooksのWebhookに送信します。これにより、Workflow WebhooksのWebhookがShopify Flowをトリガーします。その後、Webhook IDに基づいてフローのトリガーをフィルタリングし、そのIDに基づいてお客様情報を取得します。お客様が存在するかを確認し、タグを追加し、メモを追加します。

お客様には、タグとメモが次の画像のように表示されます。