在庫数以上の数がカートに入らないようにしたい

[Anonymous]

現状、在庫数以上の商品がカートに入り、会計画面でエラーが出る状態ですが、お客様にとって大変に分かりづらいです。

当店は商品のほとんどが1点もので、再入荷が難しいため、カートには在庫数以上が入らない設定にしたいです。下記の方法を試しましたが、機能しませんでした。
https://community.shopify.com/c/Shopify-Design/Customers-able-to-add-more-items-than-available-to-ca...

テーマはMinimalです。できれば無料のアプリかコードの設定で対応したいと思っています。よろしくお願いします。

[Anonymous]

こちらの方法を試しましたが、エラーが出てしまいます。

https://gist.github.com/drabbytux/881d697179b9708f1bcb582f33c59307#file-limit-cart-quantities-to-in-...

[Jizo_Inagaki]

アプリに関してですが、検索しましたら以下が出てきました。

https://apps.shopify.com/limitsify-checkout-limits-done-right

類似のアプリは以下のような検索で見つかるかと思いますので、見つからない場合は他のワードに変えて探されることをお勧めします。

https://apps.shopify.com/search?q=limit+order

[Anonymous]

ありがとうございます。

ご紹介いただいたアプリは有料でしたので、他にもないかと探していて、下記のまとめサイトを見つけましたが、やはりどれも有料アプリでした。更に探してみます。
https://shopthemedetector.com/blog/shopify-order-limit-apps/

[Jizo_Inagaki]

確認いただきありがとうございます。

一点思いつきましたが、「全商品1つづつしかカートに入らない」という仕様で良いなら以下の方法が使えるかもしれません。

• 数量セレクターを非表示にする

テーマ次第になりますが、カスタマイズで商品ページまで進めばセクション内に数量セレクターの表示設定があると思いますので、そこを利用します。

Liqudi上でも数量セレクタを消せば同種のことができるかもしれませんが、この場合もテーマ次第かもしれませんので実現可能性は不明です。

非表示で対応できる場合は、特定のタグを持っているかどうかで判定して表示を切り替えるような対応もできる可能性があり、比較的簡易なカスタマイズとして検討できるかもしれません。

[Anonymous]

どうもありがとうございます。

ただ残念ながら全ての商品が1点というわけではなく、物によっては数点あるので、ご指示の方法は使えません。

本国のコミュニティのコメントにありましたが、Shopifyは数量制限を標準仕様にするべきだと思います…。

[abekeishi]

商品にバリアントがない場合の商品の在庫数は、Liquid上で以下のような記述をすれば取得できます。

{{product.variants[0].inventory_quantity}}

この値を用いて以下のようにスクリプトを挿入すれば一応対処できるのではないかと思います。

window.onload = () => {
    // 数量の入力フォームへの入力を監視
    jQuery('.product-quantity>.quantity-field').on('input',(event)=>{
      const maxQuantity = {{product.variants[0].inventory_quantity}}  // 最大量
      const quantity = parseInt( event.target.value)  // ユーザーが入力した値
      // もし指定の値より大きければアラート(alart('メッセージ'))を表示するなどの処理を記述する
      if (typeof quantity === 'number' && quantity > maxQuantity){
        alert(`数量は${maxQuantity}個以下にしてください。`) // アラート表示する
        event.target.value = 1  // 数量を1に戻す
      }
    })
  }

商品にバリアントがある場合、バリアントごとに在庫数が異なると思うので、ユーザーがバリアントを切り替えた時の処理を記述する必要があります。

[Anonymous]

abekeishiさん

アドバイスをありがとうございます。

コードに関しては素人なので、どこに挿入すればいいのか教えて頂けますか？

宜しくお願いします。

[abekeishi]

Minimalを使ったことがないので、間違っているかもしれませんが、

product-template.liquidの一番先頭に以下のようにスクリプトとして埋め込んでしまえばいいのかと思います。

  <script>
    window.onload = () => {
    // 数量の入力フォームへの入力を監視
    jQuery('.product-quantity>.quantity-field').on('input',(event)=>{
      const maxQuantity = {{product.variants[0].inventory_quantity}}  // 最大量
      const quantity = parseInt( event.target.value)  // ユーザーが入力した値
      // もし指定の値より大きければアラート(alart('メッセージ'))を表示するなどの処理を記述する
      if (typeof quantity === 'number' && quantity > maxQuantity){
        alert(`数量は${maxQuantity}個以下にしてください。`) // アラート表示する
        event.target.value = 1  // 数量を1に戻す
      }
    })
  }
  </script>

[Anonymous]

abekeishiさま

ご丁寧にありがとうございました。

やはり、カートには在庫数以上入ってしまいました。せめて会計に行く前、カートに入れた段階で在庫数が足りない旨のお知らせが出ればいいのですが…。

本国のコミュニティでも要望が多いようなので、いずれは標準設定になることを待つことにします。どうもありがとうございました。

[Jizo_Inagaki]

一応テストストア(Debutテーマ)で確認した方法がありますので記載します。

前提はやはり「バリエーションなしの商品に限る」となります。

Minimalの数量セレクタのところに、以下のようにmax属性を追加します。

max="{{product.variants[0].inventory_quantity}}"

上記でmaxに在庫数が設定され、それ以上の数には変更できなくなるはずです。

また、maxに入れた記述は他の用途にも使えますので、以下のように数量セレクタ付近に記載して在庫数の明示もできます。

<p>在庫数:{{ product.variants[0].inventory_quantity }}</p>
<p>※ご購入のタイミングによってはチェックアウト時に在庫切れで購入不可となる可能性がありますのであらかじめご了承ください</p>

一文つけていますが、在庫表示によって「必ず買える」という期待感を与える可能性もあり、同タイミングで他のユーザーが購入してしまった際の予防線を貼った方がよいのではないか、という理由からです。
運用時の視点からの判断となりますので特に強くお勧めするものではありません。

なお、バリエーションのある商品はこれでは対応できませんのJSのコードを作成する必要があります。
ただ申し訳ありませんがこの辺りは有料対応の範囲とさせていただいていますので、具体的なコードの記述は差し控えたいと思います。

とはいえ他の方に返答いただけるかもしれませんし、検索で見つかるかなとも思います。

以上ですが、不要であったりMinimalでは動作しないようでしたら申し訳ありません。

[Anonymous]

Jizoさま

ありがとうございます。そんなに数は多くないのですが、バリエーションのある商品もあるので、それらをどのように扱うか考えてから設定させていただきます。

色々と調べて下記の、無料アプリMetafields Editorを使ってカスタマイズする方法を見つけました。ただアプリで商品ごとに在庫数を入れるなどの設定が必要で作業が多いのと、テーマが異なるので導入方法が不安で断念しました（コードは詳しくないので）。

https://coalitiontechnologies.com/blog/maximum-quantity-limiter-shopify

もし、同じ事で悩んでいる方が他にいらっしゃれば、参考までに。