Shopify では商品オプションに写真を追加できるため、顧客は各選択肢がどのようなものかを確認できます。ただし、Shopify の規制により、1 つのオプション値に 1 つの画像のみを関連付けることができます。そこで問題は、複数の画像を 1 つのオプションに関連付けるにはどうすればよいでしょうか?
Conceptに答えがあり、 1 つのオプション値に対して特定の画像を指定できます。この機能は特に色のオプションに適していますが、他の目的にも完全に使用できます。
このページでは
要件
この記事は、 Conceptテーマでのセットアップについて説明します。
バリアントを選択した後は、[他のバリアントのメディアを非表示にする]をオフにする必要があります。このオプションは、ネイティブの Shopify 動作と互換性があり、1 つの画像のみを 1 つのオプション値に関連付けます。
Conceptでは、このオプションは次のセクションで使用できます。
- 注目の製品セクション。
- 製品情報セクション (製品ページ内)
必要なオプションを選択してください
管理画面で製品を確認し、画像を分類するオプションを選択します。
以下の例では、 Color を選択することにしました。 Flow Harmony製品には、ゴールド トーン、ブラック、チェスナット、ネイビー、クリムゾン シャドウの色があり、ユーザーがオプションを選択したときにのみそれぞれの画像を表示したいと考えています。

画像のALTタグを編集する
alt タグを編集して、画像が属する「オプション名とオプション値」を指定する必要があります。
画像にカーソルを置き、6 つの点のボタンをクリックして画像の情報を開きます
代替テキストを入力します。
選択したオプション名とオプション値を組み合わせて使用します。ここでの構文は非常に重要であり、次の順序で指定する必要があります。
#
(ハッシュタグ文字)option-name
(小文字、すべてのスペースをハイフンに置き換えます)_
(アンダースコア文字)option-value
(小文字、すべてのスペースをハイフンに置き換えます)
たとえば、 [カラー]オプションを選択し、画像をゴールド トーンカラーに関連付けたい場合、代替テキストは
#color_gold-tone
にする必要があります。「保存」をクリックして変更を保存します。
他の画像についても同様の処理を行います。
独自の代替テキストを設定 (または保持)
SEO 目的で使用する独自の alt を設定 (または維持) したい場合はどうすればよいですか?次のように、 # 文字の前のalt フィールドに何かを追加するだけです。

さらに支援が必要です
コンセプト テーマに関して問題が発生した場合、または追加のサポートが必要な場合は、8 時間以内にチケット システムを通じてサポート担当者にご連絡ください。
以下の QR コードをスキャンして WhatsApp コミュニティに参加し、最新情報、ニュース、お知らせを入手してください。
Share:
私の製品にカウントダウンタイマーを追加できますか?
サブコレクションを作成するにはどうすればよいですか?