商品ページにおいて、特定の商品タグを持った商品の「カートに入れる」ボタンの文字を変更したいと考えています。
在庫がある場合…
「カートに入れる」
在庫があり、商品タグに「Pre Order」が含まれる場合…
「予約購入」
在庫がない場合…
「Sold Out」
というように表示させたいと思います。使用しているテーマはLorenza、以下のコードはproduct-buy-buttons.liquidの一部です。
{%- if product.selling_plan_groups.size == 0 -%}
{% if show_dynamic_checkout and current_variant.available %}
{{ form | payment_button }}
{% endif %}
{%- endif -%}
@akiyo 様
前提条件として、
複数のバリエーションを持つ商品を登録されていない場合に限り、
下記のコードはうまく動作するかと思います。
1つの商品が複数のバリエーションを持つ場合は、
バリエーションを商品詳細ページ上で変更してもうまく「カートに入れる」ボタンの文言が変化しない可能性が高いです。
記載いただいた下記のコードを、
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
下記のように変更してみてはどうでしょうか？
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{% if product.tags contains "Pre Order" %}
予約購入
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endif %}
{% endunless %}
有料のテーマなので動作検証もできておりませんし、
前述の通り、バリエーションを複数持つ商品の場合、おそらくバリエーション切り替えにうまく対応できないですが、
参考になれば幸いです。
なお、ベンダーにご相談いただくのが一番間違いないので、
もしまだ試していらっしゃらないようなら、
お問い合わせいただくと良いかもしれません。
(キュー田辺)
Hey,
残念ながら、Shopify には商品タグに応じて「カートに入れる」ボタンの文言を自動で「予約購入」に切り替えるための標準設定はありません。対応するには、Lorenza のテーマコードを編集する必要があります。
手順は Online Store → Themes → Edit code から、product-buy-buttons.liquid を探してください。そのうえで、Liquid の条件分岐を追加し、product.tags に “Pre Order” が含まれているかどうか、そして current_variant.available の状態を確認して、状況に応じてボタンの文言を出し分けます。参考：
https://help.shopify.com/en/manual/online-store/themes/customizing-themes
この方法はテーマ編集が必要で、テーマの更新があるたびにメンテナンスが発生する可能性があります。
別の方法として、K1 PreOrder を使うと自動化できます（私は K1 PreOrder の創業者です）。ボタンの自動置き換え、日本語テキスト（「予約購入」）の自由なカスタマイズ、在庫状況（在庫あり／在庫なし）に応じた表示切り替えを、商品タグを条件にして smart collections 経由で実現できます。該当する場合はこちら：
必要であれば、テーマ側のカスタマイズ実装もサポートできます。
これには、メタ フィールドを使用して各製品のボタン名とボタン アクションを一致させることが含まれ、これを実現するには製品情報ページのコードを変更する必要があります。