Shopify Flow からのデータの受け渡し

メールのレイアウトは、穴の開いた図形のようなものです。**変数(JSON)**とは、Shopify Flowがそれらの穴を埋める仕組みのことです。

これは最もよくある間違いですので、5分ほど時間を割く価値があります。

2つの部分

どこで あなたが書く内容 例
メールのレイアウトにおいて プレースホルダー Hi {{ variables.firstName }}
「In the Shopify Flow」アクション それを提供するJSON {"firstName": "{{ order.customer.firstName }}"}

JSONの左側にあるキーは、レイアウト内のvariables.の後に続く名前と、スペルや大文字・小文字の区別まで完全に一致している必要があります。firstNameとfirstnameは、それぞれ異なる変数となります。

アプリにJSONの作成を任せてみましょう

これを手書きで書く必要はありませんし、おそらくそうすべきではないでしょう。

レイアウトを開いてください。サイドバー(またはビジュアルビルダーの「テスト変数」タブ)には、「Shopify Flowで使用する」というカードがあり、そのレイアウト用の正確なJSONが記載されています。すべてのキーはすでに正しく設定されています。「JSONをコピー」をクリックし、その内容を「トランザクションメールを送信」アクションの「変数(JSON)」フィールドに貼り付けてください。

このアプリは、認識したフィールド(顧客名、注文名、注文合計額、ステータスページのURLなど)の「Shopify Flow」プロパティを自動的に入力します。推測できない項目については、「<pick a Flow variable>」と表示されますので、そちらを適切な値に置き換えてください。

JSONはどのような形式でなければならないか

{
  "firstName": "{{ order.customer.firstName }}",
  "orderName": "{{ order.name }}",
  "statusPageUrl": "{{ order.statusPageUrl }}"
}

知っておくと役立つルール:

  • Shopify Flowの値はすべて二重引用符で囲んでください。「"orderName": {{ order.name }}」は不正なJSONですが、「"orderName": "{{ order.name }}"」は正しい形式です。
  • 項目間はコンマで区切り、最後の項目の後にはコンマを入れないでください。
  • **キーの名前はご自由に決めてください。**レイアウトと一致していれば問題ありません。レイアウトに「{{ variables.kunde }}」と記載されている場合、キーは「kunde」となります。
  • 値はテキストとして渡されます。数値や日付は、Shopify Flowがレンダリングした形式のまま渡されます。
Shopify Flowの「トランザクションメールを送信」アクションで、返信先、送信者名、言語、およびShopify Flow変数が設定された変数JSONを使用します
アクション内の変数(JSON):左側に独自のキー、右側にShopify Flowの変数が表示されます。その上には、「返信先」、「送信者名」、「言語」の各フィールドがあります。
「Shopify Flow」パネルが配置されたレイアウトの「テスト変数」タブと、その「JSONをコピー」ボタン
レイアウトの「テスト変数」タブでは、JSONが自動的に生成されます。「JSONをコピー」し、それをアクションに貼り付けて、値を置き換えてください。

最もよくある間違い:ラインアイテム

注文には_多くの_ラインアイテムがあるため、読み込むべき単一のvariant.titleは存在しません。この場合、何も返されません:

{{ order.lineItems.variant.title }}

2つの良い選択肢があります。

**オプション 1 - レイアウト内でループを実行します。**リストを送信してから、反復処理を行います。「Shopify Flow」アクションでは:

{
  "items": "{{ order.lineItems | json }}"
}

レイアウトでは、ループブロックを使用してください:

{% for item in variables.items %}
  <tr>
    <td>{{ item.title }}</td>
    <td>{{ item.quantity }}</td>
  </tr>
{% endfor %}

**オプション 2 - Shopify Flow で平坦化します。**テキストを 1 行だけ必要とする場合は、Shopify Flow で for ループを使用して作成し、完成した文字列を送信してください:

{
  "itemList": "{% for li in order.lineItems %}{{ li.title }} x{{ li.quantity }}{% unless forloop.last %}, {% endunless %}{% endfor %}"
}

アプリが、ラインアイテムデータのように見える変数(variant、product、item、sku、quantityといった名前のもの)を検出した場合、「Shopify Flowでの使用」カードでその旨を警告します。

テスト値は実際の値ではありません

これは、ほとんどすべての人がつまずいてしまうところです。

  • レイアウトエディタ内の**テスト変数は、**プレビューおよび「**テストメールを送信」**機能のみに影響します。
  • Shopify Flowのライブ実行では、これらは完全に無視され、Shopify Flowアクションから送信された内容がそのまま使用されます。

つまり、見た目が完璧なテストメールは、_デザイン_が機能していることを証明するものです。しかし、Shopify Flowの設定については何も証明しません。必ず実際のワークフローを実行して確認してください。

変数の値が空の場合

バージョン1.10.0以降、アプリはユーザーに推測をさせるのではなく、直接お知らせするようになりました。

ライブ送信によって変数が「なし」となった場合、履歴のエントリには「**空の変数」**バッジが表示され、それを開くと、以下の2つのケースに分けて、どの変数が該当するかが正確に表示されます:

事例 意味 修正
Shopify Flow から送信されましたが、内容は空でした キーはJSONの中にありましたが、Shopify Flowは値を返さなかったのです この注文において、「Shopify Flow」プロパティのパスが間違っているか、あるいは実際に空になっています(ゲストチェックアウトの場合、「customer.firstName」は存在しません)。
Shopify Flowからは一切送信されていません JSONからそのキーが完全に欠落しています これを追加してください。「JSONをコピー」ボタンをクリックすると、全データが取得できます

空の値に対する対策

オプションの項目については、レイアウト内で代替案を用意し、お客様に空白が表示されないようにしてください:

Hi {{ variables.firstName | default: "there" }}

default:フィルターが設定されている場合、アプリは空の値を意図的なものとみなすため、これについて警告は表示されません。

チェックリスト

  1. レイアウト上の「**Shopify Flowで使用する」**カードからJSONをコピーしてください。
  2. それをShopify Flowアクションの「**変数(JSON)」**フィールドに貼り付けてください。
  3. Shopify Flowの変数ピッカーを使用して、<pick a Flow variable> をすべて置き換えてください。
  4. ラインアイテムを直接読み込むのではなく、ループ処理を行ってください。
  5. 任意の項目には、| default: を追加してください。
  6. ワークフローを実際に実行し、[履歴] で「空の変数」バッジが表示されているか確認してください。

関連情報