特定の商品にのみ「販売期間前」という表示をしたい

[uf2]

使用テーマ：DAWN 11.0.0

在庫０の商品のうち、特定の商品だけ「販売期間前」という表示にしたいです。

販売期間前表示をしたい商品のタグに「販売期間前」を追加してみました。

Sectionのmain-product-liquidが商品詳細ページと考えて、ここに条件分岐のコードを追加すれば解決

できるのではないかと考えました。

「販売期間前」というタグがあった場合は在庫０でも完売表示ではなく任意の表示にする、というコードを追加したく、どなたかこの条件のコードがわかる方がいらっしゃいましたらご教示いただきたく存じます。

また、そもそもやり方が間違っておりましたら正しいやり方について教えていただけると幸いです。

[Qcoltd]

@uf2 様

ご質問いただいている、販売期間前を表示したい件ですが、

こちらは、価格の右側と購入ボタンの『売り切れ』表示を『販売期間前』としたいとご要望と認識し回答させていただきます。

下記変更方法はDawn11.0.0のデフォルトを前提としています。

変更方法

1.管理画面のテーマ > 『•••』 > コードを編集をクリック

2.テーマを絞り込むに『buy-buttons.liquid』と『price.liquid』入力しそれぞれのファイル開く

3.『buy-buttons.liquid』の66行目と67行目の間に下記コードを追加

{%- if product.tags contains '販売期間前' and product.variants.first.inventory_quantity == 0 -%}

{%- else -%}

4.『buy-buttons.liquid』の112行目に下記コードを追加

{%- endif -%}

5.『price.liquid』の124行目と125行目の間に下記コードを追加

{%- if product.tags contains '販売期間前' and product.variants.first.inventory_quantity == 0 -%}
販売期間前
{%- else -%}

6.『price.liquid』の129行目に下記コードを追加

{%- endif -%}

以上で、在庫が0で商品タグ『販売期間前』付いている商品は下記のように、表示されるかと思います。

※Shopifyのキャッシュで切り替わりに時間がかかる場合がありますので、ご了承ください。

ご参考まで。

（キュー小坂）

[uf2]

株式会社Q

小坂 様

ご丁寧に画像付きで解説いただき誠にありがとうございます。

ご指南いただいた通り編集したところ、無事に「販売開始前」表示をすることができました…！

上記は商品詳細ページに入った際の、価格横と数量下の表示に対応しているかと存じますか、

コレクションで商品が並んでいる際の、画像左下に表示される「売り切れ」表示も同様に

「販売開始前」にしたいと考えております。

この場合でしたらどこのファイルを編集すればよいでしょうか…？

内容的にprice-liquidで張り付けたコードを流用できるのではないかと思ったのですがやり方がわからず…。

お忙しいところ重ねて質問してしまい大変恐縮なのですが、お手すきの際にご確認いただけましたら幸いです。

[Qcoltd]

@uf2 様

ご質問いただきました、一覧の「売り切れ」部分を「販売開始前」に変更したい件ですが、

『card-product.liquid』が対象のファイルとなります。

ファイル内で、下記二つのコードを

{{- 'products.product.sold_out' | t -}}

{{ 'products.product.sold_out' | t }}

下記としていただければと思います。

{%- if card_product.tags contains '販売期間前' and card_product.variants.first.inventory_quantity == 0 -%}
販売期間前
{%- else -%}
{{- 'products.product.sold_out' | t -}}
{%- endif -%}

{%- if card_product.tags contains '販売期間前' and card_product.variants.first.inventory_quantity == 0 -%}
販売期間前
{%- else -%}
{{ 'products.product.sold_out' | t }}
{%- endif -%}

ご参考まで。

（キュー小坂）

[uf2]

小坂様

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

無事「販売期間前」表示に切り替えることができました。

ずっとやり方がわからず困っていたため大変助かりました。この度は誠にありがとうございました。