Dawnでのバリエーション毎の在庫表示について

Topic summary

Dawnの商品ページで、バリエーションごとの在庫状態を切り替え無しで見たいという要望。投稿者はLiquidで「在庫あり/在庫なし/販売継続/再入荷待ち(入荷予定日)」を一覧表示できたが、ドロップダウンと統合して分かりやすくしたい。

提案:複数オプション(例:色・サイズ)がある場合、ドロップダウンに「入荷待ち」などの詳細を一意に反映するのは難しい。一方で「在庫あり/在庫なし」の可視化は、sections > main-product.liquid のドロップダウン出力を加工すれば追加可能。コードスニペットが中心。

不具合と修正:初版では在庫なしも「在庫あり」表示になる不具合あり。原因は在庫状態文字列の定義位置の誤りと不要な括弧。改善版コードが提示され、正しく在庫状況が付与されるよう修正。

注意点・制約:異なるオプションなのに同じ値(例:色1,2,3/サイズ1,2,3)だと動作が崩れる可能性。詳細状態のドロップダウン反映は原理的に困難。

現状:改善版で実用的な在庫表示は可能。検証は限定的で、エッジケース対応は今後の課題。

Summarized with AI on February 8. AI used: gpt-5.

dawnにて販売ページを使用していますが、バリエーション毎の在庫の有無がバリエーションを切り替えなければ表示できず、非常にストレスがあります

下記のカスタムLiquidで表示させることはできたのですがプルダウンと合わせて表示したりわかりやすくする方法はありますか?

{%- for variant in product.variants -%}

{%- assign is_in_stock = false -%} {%- if 0 < variant.inventory_quantity -%}{%- assign is_in_stock = true -%}{%- endif -%}

{{ variant.title | escape }} -

{%- if is_in_stock -%}
在庫あり
{%- elsif is_in_stock == false and variant.inventory_policy == ‘continue’ -%}
在庫なし 販売を続ける
{%- elsif is_in_stock == false and variant.incoming -%}
在庫なし 再入荷待ち 入荷予定日:{%- if variant.next_incoming_date -%}{{ variant.next_incoming_date | date:“%Y/%m/%d” }}{%- else -%}未定{%- endif -%}
{%- elsif is_in_stock == false -%}
在庫なし
{%- endif -%}

{%- endfor -%}
1 Like

variantのoptionが2つ以上ある場合を考慮しますと、

質問者様に記載いただいているような、「入荷待ち」のような情報まで、

ドロップダウンに記載するのは難しいかもしれません。

例えば、商材がアパレルだったとします。

optionとして、サイズと色の2種類があったとします。

この時、ある商品に下記のように4種類のvariantが存在したとします。

  1. WHITE / S

  2. WHITE / M

  3. BLACK / S

  4. BLACK / M

WHITE / Sが入荷待ちで、WHITE / Mが入荷予定がなかったとします。

この時、「色」を選択するドロップダウン中の、

WHITEという選択肢において、入荷待ちなのか入荷予定がないのかを、

一意に決定することができません。

どこまでできるか考えてみたのですが、

在庫の有無くらいは、ドロップダウンに追加できそうです。

Dawnをお使いとのことで、

セクション(sections) > main-product.liquidのドロップダウンを出力する箇所を下記のように変更することでできそうです。

(十分な検証はできていないので、うまく動作しないパターンがあるかもしれません。)

元のコード


変更後のコード


ご要望通りの回答ではなく恐縮ですが、

何かの参考になれば幸いです。

(キュー田辺)

ご回答ありがとうございます。

提案いただいた通りバリエーション毎に在庫のあり、なしがドロップダウンに追加されるだけで

とてもありがたいです。

記載いただいたコードを試したところ在庫のないバリエーションも全て「在庫あり」で表示されてしまいます。

上手く作動させることはできそうでしょうか?

@Tomonyan

失礼しました。

下記の在庫状況の文字列の定義位置がよくありませんでした。

{%- assign variantOptionInventoryStatus = '在庫なし' -%}

また、不要な"}"が紛れ込んでいたので合わせて修正しました。

改善版


なお、

異なるoptionのvalueに同一の値が入るとうまく動作しないです。

例えば、アパレルを例にとると、

かなり特殊な状況ですが、色もサイズも数字で表すというようなことをされているとうまく動作しません。

[例]

色: 1,2,3

サイズ: 1,2,3

エッジケースですので、この点の改良については、必要とされている方がいらっしゃれば考えてみます。

ご参考まで。

(キュー田辺)

1 Like