Shopify Flow でのワークフローエディタの使用

ワークフローエディタは、Shopify Flowのワークフローの機能をカスタマイズおよび編集できるツールです。ワークフローエディタはドラッグ&ドロップ式のキャンバスで、さまざまな種類のステップを上から下への縦方向の形式で追加することで、ワークフローを追加、整理、デザインできます。

注意

2025年12月10日より前に作成された既存のワークフローは、従来の左から右への形式を保持します。2026年1月には、すべてのワークフローが上から下への形式に更新されます。2026年1月より前に、既存の左から右へのワークフローを更新して縦方向の形式を使用する場合、キャンバス上でワークフローを自動的に再配置して、上から下への形式にすることができます。この操作は元に戻せません。

ワークフローエディタを使用してワークフローに追加できる最初のステップは、常にトリガーステップです。ワークフローのトリガーを追加すると、+ アイコンを使用して、ワークフローシーケンスで次に実行される条件ステップまたはアクションステップを追加できます。矢印は、ワークフローエディタのキャンバス上でさまざまなステップを接続し、実行された条件やアクションに基づいて、どのステップがどのステップに直接つながるかを示します。

すべてのステップは、機能するためにワークフロー内の少なくとも1つの他のステップに接続する必要があります。ワークフローエディタのキャンバス上のどこにでも、ワークフローの外部にステップを追加できますが、矢印で別のステップに接続されていない限り、そのステップはワークフローに関与しません。各ステップは先行するステップを1つしか持つことができないため、ワークフローの複数の分岐を1つのステップパスに再統合することはサポートされていません。

ワークフローエディタの左側にある設定パネルを使用して、条件ステップとアクションステップの詳細を設定できます。設定パネルは、ステップが選択されている場合にのみ表示されます。

ヒント

ワークフローエディタでワークフローにメモを追加できます。メモを使用すると、自分の言葉でワークフローに関する情報を記録できます。

ワークフローエディタでワークフローを開く

Shopify Flowでは、新しいワークフローを作成するか、既存のワークフローをクリックしてから [編集] をクリックすることで、ワークフローエディタにアクセスできます。

手順：

1. 管理画面で、[アプリ] > [Flow] の順に移動します。

2. [ワークフロー] セクションで、次のいずれかのアクションを実行します。

   • 新しい空のワークフローのワークフローエディタを開くには、[ワークフローを作成] をクリックします。
   • 既存のワークフローのワークフローエディタを開くには、ワークフローをクリックしてから、[編集] をクリックします。

ワークフローにステップを追加する

ワークフローエディタでは、次のいずれかの方法でワークフローキャンバスにステップを追加できます。

• 既存のステップにカーソルを合わせ、 + アイコンをクリックして、ワークフローの次の接続として追加する条件またはアクションのステップを選択します。
  • 条件ステップには2つの + アイコンがあります。1つは条件が満たされた場合の [True] パス用、もう1つは条件が満たされない場合の [False] パス用です。
  • [For eachループ (繰り返し)] アクションステップにも2つの + アイコンがあります。1つは、リスト内の各アイテムに対して実行されるステップを定義できる [各アイテムを繰り返す] 用、もう1つは、リストの最後のアイテムが返された後に実行されるステップを定義できる [最後のアイテムの後] 用です。
• ワークフローキャンバス上の何もないスペースをクリックします。キャンバスに既存のトリガーがない場合、設定パネルにはトリガーステップのオプションが表示されます。キャンバスに既存のトリガーがある場合、設定パネルにはアクションステップのオプションが表示されます。

ワークフローでステップを接続する

すべてのステップは、機能するためにワークフロー内の少なくとも1つの他のステップに接続する必要があります。ワークフローエディタは、方向を示す矢印を使用して、どのステップがどのステップに接続されているかを示します。デフォルトでは、ワークフローはキャンバス上で上から下へ縦方向に流れます。

`+` アイコンを使用して別のステップからワークフローにステップを追加すると、新しいステップは先行するステップに自動的に接続されます。また、最初のステップで `+` をクリックしたまま矢印の端を2番目のステップまでドラッグすることで、ステップ間の接続を手動で作成することもできます。各ステップは先行するステップへの接続を1つしか持つことができないため、ワークフローの複数の分岐を1つのステップパスに再統合することはサポートされていません。

削除する矢印にカーソルを合わせ、 アイコンをクリックすると、ステップ間の接続を削除できます。

ワークフローキャンバスでステップを配置する

ワークフローエディタのドラッグ&ドロップキャンバスを使用して、ワークフローの表示方法を手動で整理できます。これにより、ワークフローを構築する際に、ワークフローを把握しやすくなります。デフォルトでは、ステップは上から下への形式で相互に接続されますが、ステップ間の矢印による接続を維持したまま、キャンバス上のどこにでもステップをドラッグ&ドロップできます。

キーボードの Shift キーを押しながら、グループとして選択するステップをクリックすることで、一度に複数のステップを移動できます。グレーのグループボックス内のいずれかのステップをクリックしてドラッグすると、含まれているステップをまとめて移動できます。

ステップ間にデフォルトの間隔を空けてワークフローのレイアウトを自動的にリセットし、ワークフローを確認しやすくすることができます。 アイコンをクリックし、[ワークフローを配置] をクリックしてリセットを確定します。

注意

従来の左から右への形式を使用している既存のワークフローを自動的にリセットすると、ワークフローのレイアウトが上から下への形式に更新されます。この操作は元に戻せません。

ワークフローからステップを削除する

ワークフローエディタでは、削除するステップにカーソルを合わせ、ステップの横にある アイコンをクリックすることで、ワークフローからステップを削除できます。ステップの削除は元に戻せません。

キーボードの Shift キーを押しながら、グループとして選択するステップをクリックすることで、一度に複数のステップを削除できます。グレーのグループボックスの上にある アイコンをクリックすると、ステップをまとめて削除できます。

他のステップが接続されているステップを削除すると、それらのステップはワークフローキャンバス上に残りますが、先行するステップとの接続は解除されます。ワークフローでそれらのステップを引き続き使用するには、切断されたステップを手動で再接続する必要があります。

ワークフローエディタ表示ツールバーの使用

ワークフローエディタの下部にある表示ツールバーで、以下のいずれかのアイコンをクリックできます。

• またはを使用して、ワークフローをズームアウトまたはズームインします。
• を使用して、ワークフロー全体が表示されるズームレベルで、表示キャンバスの中央にワークフローを配置します。
• を使用して、新しいブラウザータブでShopify Flow ヘルプセンターのドキュメントを開きます。
• を使用して、ワークフローのレイアウトを整理します。

ワークフローエディタでステップ設定パネルを使用する

ステップを選択すると、ワークフローエディタの左側に設定パネルが表示されます。設定パネルにはステップの詳細が表示され、ステップに実行させたい内容に応じて、変数の設定、論理演算子の割り当て、カスタムアクション情報の追加など、特定のステップの機能をカスタマイズできます。

設定パネルに表示されるオプションは、選択したステップの種類に直接関連しています。

ステップの説明の追加または編集

設定パネルから、条件ステップまたはアクションステップの説明を編集できます。「説明を追加」または「説明を編集」をクリックし、ステップの説明を自分の言葉で入力します。自分の言葉で説明を記載すると、ワークフローの動作を自分や他のスタッフが理解しやすくなります。説明フィールドのテキストをすべて削除すると、ステップの説明をリセットできます。

設定コンテンツが不足しているステップの確認

ステップの機能に影響するデータや設定の詳細が欠落している場合、ステップの上部に「要確認」バナーが表示されます。ステップをクリックして設定パネルを開き、不足しているデータを追加すると、「要確認」バナーは表示されなくなります。フィールドに任意であるとの記載がない限り、ステップの設定を完了するには入力が必須です。

ステップが他のステップに接続されていない場合も、「要確認」バナーが表示されます。ステップの詳細設定を続けるには、ワークフロー内の別のステップにそのステップを接続する必要があります。

ワークフローを有効化しようとする前に「要確認」バナーが解決されていない場合、そのステップはエラーとして表示され、ワークフローは有効になりません。ワークフローを有効にするには、ワークフロー内のすべての設定エラーを解決する必要があります。

「変数を追加」ダイアログの使用

ステップ設定パネルの一部のフィールドには、設定コンテンツに変数を追加するための「変数を追加」オプションがあります。「変数を追加」ダイアログに表示されるデータセットは、ワークフローの先行するステップから返されるデータによって決まります。たとえば、デフォルトでは、「変数を追加」ダイアログに以下のオプションが表示されます。

• 名前または説明で変数を検索するための検索バー。
• ワークフローのトリガーによって返されるデフォルトの変数データセット。通常、以下のオプションが含まれます。
  • ストアに共通のグローバルなshop変数。
  • ワークフローのトリガーに基づいた、少なくとも他に1種類のタイプ。

ただし、「データを取得」アクションや「コードを実行」など、追加のデータを返すステップをワークフローに追加すると、その時点で追加のデータが利用可能になります。そのため、ワークフローのブランチで後続のステップでは、追加の変数データセットがダイアログに表示され、選択できるようになります。返されたデータは、新しいものから順に表示されます。

さまざまな変数オプションをクリックしていくと、特定の変数に移動できます。一部の変数にはネストされたオプションがあり、変数APIパスにサブオプションが存在することを示す > が表示されます。変数APIパスの末尾に到達すると > は表示されなくなり、代わりにその変数が返す情報の種類 (String、Boolean、DateTime、Intなど) を示すコンテンツタイプバッジが表示されます。

ヒント

変数の特定の要素について詳しく知るには、その変数にカーソルを合わせ、アイコンをクリックすると、関連するShopify Dev Docsの記事が開きます。