🦔

Shopifyでセット販売の在庫連携を行う方法を考察

2024/08/09に公開

はじめに

今回は、Shopify でセット販売の在庫連携を行う方法について考察します。

靴下 3 点セットと靴下 1 点の二つの商品が存在する状態で、靴下 3 点セットが販売された際に靴下 1 点の在庫を三つ減らす、という感じの機能ですね。

いわゆる、セット商品を作成する方法について、今回の記事では考察していきます。

メタフィールドや Shopify の Functions を利用する方法等について調べてみました。

セット販売とは、複数の商品をひとつのセットとして販売する手法です。

この手法は、顧客に対して魅力的な価格や特典を提供することで、売上を増加させる効果があります。しかし、セット販売を効果的に運用するためには、在庫管理が重要な要素となります。

ここでは、Shopifyでセット販売を行う際の在庫連携について解説します。

それでは、頑張っていきましょう。

セット販売の在庫連携の定義

セット販売の在庫連携とは、セット商品を構成する各商品の在庫を正確に管理し、販売時に在庫の引き落としを自動で連携させることを指します。

これにより、セット商品の在庫状況が常に最新の状態に保たれ、在庫切れや販売停止のリスクを減らすことができます。

超具体的に書くと、化粧品 5 点セット等の商品を作成し、そのセット商品が販売された際に、そのセット商品を構成している商品の在庫を減らしたい、という感じですね。

セット販売の在庫連携のメリット

せっかくなので、セット販売の在庫連携を行うメリットについて解説します。

何か利点が無いと、実装する意味が無いですからね。

1. 在庫管理の効率化

セット販売の在庫連携を導入することで、各商品の在庫を一元的に管理することができます。これにより、在庫状況の把握が容易になり、在庫切れや過剰在庫のリスクを減らすことができます。

2. 顧客満足度の向上

在庫連携により、セット商品の在庫状況が常に正確に反映されるため、顧客が購入しようとした際に在庫切れが発生するリスクが低くなります。これにより、顧客満足度が向上し、リピート購入を促進することができます。

3. 売上の最大化

セット販売は、顧客に対して魅力的な価格や特典を提供することで、売上を増加させる効果があります。在庫連携を導入することで、セット商品の販売がスムーズに行われ、売上の最大化を図ることができます。

セット販売の在庫連携の実装方法

それではここから、セット販売の在庫連携の方法について考察していきます。

セット販売の在庫連携をするうえで、以下 Function API を使用することができそうです。

https://shopify.dev/docs/api/functions/reference/cart-transform

こちらのドキュメントを読み込んでいきましょう。

The Cart Transform API enables you to write functions that modify the pricing and merchandising of cart line items. You can expand a single cart line item to form a bundle of components or add-on products, merge multiple cart lines into a single line that represents a bundle, and update line items to override the price, title, or image.
The API includes the RunInput object, which represents the cart, and the FunctionRunResult object, which represents the operations to perform on the cart.

上記のドキュメントの解説にあるように、割と色々なことができそうですね。

こちらのドキュメントに書いてあったことを、ざっくりと要約します。

ShopifyのCart Transform APIは、カート内のラインアイテムの価格設定や商品構成を変更するための強力なツールです。このAPIを利用することで、カートのアイテムをバンドルとして拡張したり、複数のカートラインを一つのバンドルとして統合したり、ラインアイテムの価格やタイトル、画像をオーバーライドすることができます。

以下に、Cart Transform APIの主要な機能とその活用方法について詳しく解説します。

Cart Transform APIの基本機能

Cart Transform APIを使用することで、カート内のアイテムに対して以下の操作を行うことができます:

  1. ラインアイテムの拡張

    • 単一のカートラインアイテムを、複数のコンポーネントや追加商品のバンドルに拡張することができます。これにより、特定の商品の購入時に関連するアイテムを自動的に追加することが可能です。
  2. 複数カートラインの統合

    • 複数のカートラインを一つのラインに統合し、バンドルを代表するアイテムとして扱うことができます。これにより、顧客に対して一括で割引を提供したり、バンドル商品として表示することが容易になります。
  3. ラインアイテムの更新

    • カート内のラインアイテムの価格、タイトル、画像をオーバーライドすることができます。これにより、特定の条件下で商品の表示情報を動的に変更することができます。

Cart TransForm Function APIの主要オブジェクト

Cart Transform APIでは、以下の2つの主要オブジェクトを使用します:

  • RunInputオブジェクト

    • RunInputオブジェクトは、現在のカートの状態を表します。このオブジェクトには、カート内のすべてのラインアイテムや、それらに関連するデータが含まれています。開発者はこのオブジェクトを使用して、カートの内容を解析し、必要な変更を決定します。
  • FunctionRunResultオブジェクト

    • FunctionRunResultオブジェクトは、カートに対して実行する操作を表します。このオブジェクトには、拡張、統合、更新などの操作が含まれます。開発者はこのオブジェクトを使用して、カートに対する具体的な変更を定義します。

ここまでで、Cart Transform Function APIのざっくりとした解説は終了です。

次は、Cart TransForm Function APIのサンプルコードを確認していきましょう。

Cart Transform Function API のサンプルコード

それでは次に、Cart Transform Function APIのサンプルコードを見ていきましょう。

以下が、run.grapqlです。

query RunInput {
  cart {
    lines {
      id
      quantity
      cost {
        amountPerQuantity {
          amount
          currencyCode
        }
      }
      # Access the cart line attribute to decide if a warranty should be added
      warrantyAdded: attribute(key: "Warranty Added") {
        value
      }
      merchandise {
        __typename
        ... on ProductVariant {
          id
          title
          product {
            # Access the metafield value to determine the cost of the warranty
            warrantyCostPercentage: metafield(namespace: "$app:some_namespace", key: "warranty-cost-percentage") {
              type
              value
            }
          }
        }
      }
    }
  }
  cartTransform {
    # Access the variant ID that represents the warranty product
    warrantyVariantID: metafield(namespace: "$app:some_namespace", key: "warranty-variant-id") {
      value
    }
  }
  presentmentCurrencyRate # Decimal conversion rate between shop currency and cart currency
}

今回は、Cart Transform APIexpand operationを利用していきましょう。

{
  "operations": [
    "expand": {
      "cartLineId": "gid://shopify/CartLine/1",
      "title": "Awesome TV with Warranty",
      "image": null,
      "expandedCartItems": [
        {
          "merchandiseId": "gid://shopify/ProductVariant/1",
          "quantity": 1,
          "price": {
            "adjustment": {
              "fixedPricePerUnit": {
                "amount": "1000.00"
              }
            }
          }
        },
        {
          "merchandiseId": "gid://shopify/ProductVariant/2",
          "quantity": 1,
          "price": {
            "adjustment": {
              "fixedPricePerUnit": {
                "amount": "150.00"
              }
            }
          }
        }
      }
    }
  ]
}

上記のように、特定のcartLineIdの商品を、expandedCartItemsmerchandiseIdvariantIdを指定することで拡張できます。

ここまでで、Cart Transform Function APIの解説は終了です。

ここから、Shopify でセット販売の在庫連携を行う方法について考察していきます。

Cart Transform Function API を使ってセット販売の在庫連携を行う方法

下記のドキュメントにあるとおり、run.graphqlの中で商品のメタフィールドを取得することができます。

https://shopify.dev/docs/api/functions/reference/cart-transform

そのため、商品のメタフィールドに在庫連携をする商品のvariantIdを持たせることで、セット販売の在庫連携を行えそうです。

商品のメタフィールドに、以下の値を持たせましょう。

{
  "product_variant_ids": string[]
}

これで、設定した値をrun.graphqlから取得することができます。

run.graphqlで取得した後は、output.jsonとしてexpandedCartItemsを設定してあげるだけで、セット商品の在庫連携は完了です。

それでは商品のメタフィールドに、データを定義していきましょう。

カスタムデータから、メタフィールドの定義を作成していきましょう。

今回は商品を選択していきます。

定義を追加から、メタフィールドの定義を追加していきましょう。

下記のように入力項目を埋めて下さい。今回はデータ構造にJSONを指定します。

JSONスキーマに下記の値を入力してください。

{
  product_variant_ids: []
}

右下の保存をクリックしてください。これで、メタフィールドの設定は完了です。

後は、Shopify のカスタムアプリを使って Function API を実装すれば、セット販売の在庫連携を実現できるかと思います。

エンジニアではない方には難しいかと思うので、Shopify アプリを使う方法も紹介します。

アプリを使ってセット販売の在庫連携を行う方法

それでは次に、Shopify アプリを使ってセット販売の在庫連携を行う方法を調べていきます。

以下の記事が参考になりました。

https://unreact.jp/shopify-apps/sa-051-ur-set-stock-app/guide

https://unreact.jp/blog/shopify-blog-bundle-app

https://unreact.jp/blog/shopify-app-bundle-ranking

https://qiita.com/eijiSaito/items/f123f57c1ac2f3e16dd9

https://unblog.unreact.jp/blog/woznscgx6nm7

https://unreact.jp/blog/shopify-bundle-set-stock

今回紹介するのは、シンプルセット商品在庫連携|お手軽セット商品管理の自動化というアプリです。

https://apps.shopify.com/shopify-application-428?locale=ja

シンプルセット商品在庫連携|お手軽セット商品管理の自動化 の機能について

それでは、シンプルセット商品在庫連携|お手軽セット商品管理の自動化の機能について調べていきます。

https://apps.shopify.com/shopify-application-428?locale=ja

こちらの Shopify アプリは、任意の商品でセット販売を簡単に実現できるアプリです。

以下の画像のように、Tシャツ 2点セットを購入した際に、白Tシャツと黒Tシャツの別々の商品の在庫を減らすことができます。

また、紐づいている商品の在庫がなくなった際に、セット商品を購入できなくする機能もあります。

恐らく、Cart Transform API の expand メソッドを利用して実装されているのでしょう。

{
  "operations": [
    "expand": {
      "cartLineId": "gid://shopify/CartLine/1",
      "title": "Awesome TV with Warranty",
      "image": null,
      "expandedCartItems": [
        {
          "merchandiseId": "gid://shopify/ProductVariant/1",
          "quantity": 1,
          "price": {
            "adjustment": {
              "fixedPricePerUnit": {
                "amount": "1000.00"
              }
            }
          }
        },
        {
          "merchandiseId": "gid://shopify/ProductVariant/2",
          "quantity": 1,
          "price": {
            "adjustment": {
              "fixedPricePerUnit": {
                "amount": "150.00"
              }
            }
          }
        }
      }
    }
  ]
}

Cart Transform Function APIを利用した実装が難しい場合には、こちらのアプリを利用することになるかと思います。

https://apps.shopify.com/shopify-application-428?locale=ja

終わりに

ここまでで、カスタムアプリを作成してセット販売の在庫連携を作成する方法と、Shopify のセット販売の在庫連携アプリを用いて実装する方法の二つを解説しました。

お疲れさまでした。

Discussion