成功
商品ギャラリー設定
デバイス全体で、商品ギャラリーのレイアウト、バリアントメディアの動作、ズーム、動画再生を調整します。
これらの設定を使用して、デスクトップとモバイル全体で商品メディアの表示方法を制御します。画像の見え方、商品情報、バリアント固有のメディア動作、動画再生のバランスを取ることで、ギャラリーをカタログと商品ページのレイアウトの両方に適したものにできます。これらのコントロールがテーマエディター内でどのように位置付けられるかの概要については、テーマエディターに関するShopifyドキュメントを参照してください。
ギャラリー設定
Section titled “ギャラリー設定”この設定グループでは、商品画像と動画の主な表示オプションを扱います。利用可能なコントロールの全一覧については、商品ギャラリー設定とセクションとブロックに関するShopifyドキュメントを参照してください。
デスクトップとモバイルで、個別の画像アスペクト比を選択できます。これは、カタログに縦長の商品写真、正方形の画像、横長のライフスタイル写真が混在している場合に特に便利です。
最もきれいな結果にするには、表示比率を元画像の形に合わせてください。商品写真が商品ごとに大きく異なる場合、表示比率を統一すると全体の印象をより洗練されたものにできますが、不揃いなトリミングを完全に隠すことはできません。
カタログ全体で商品画像の構図が大きく異なる場合、表示比率を変更すると一貫性は向上しますが、一部の商品が他よりもきつく、またはゆるく見える場合があります。
デスクトップレイアウト
Section titled “デスクトップレイアウト”デスクトップ専用のレイアウトコントロールでは、ギャラリーの位置と、メディア列と商品情報列の相対的な幅を選択できます。これらの設定を使って、画像と購入詳細のどちらをより強調するかを決めてください。
メディア列を大きくすると、アパレル、アート作品、詳細なハンドメイド商品など、視覚情報に大きく依存する商品に通常は最適です。仕様、オプション、説明コンテンツが画像と同じくらい重要な場合は、よりバランスの取れた列のほうが見やすいことがよくあります。
モバイルでは常に1列に積み重なるため、ギャラリーの位置はデバイス横断のレイアウトルールではなく、デスクトップ向けの表示設定として扱ってください。スライダー形式のメディアを使う場合は、静的なグリッドや積み重ね表示とはナビゲーション、ページネーション、プレビューの動作が異なることがあるため、デスクトップとモバイルのレイアウトを個別に確認してください。
ギャラリースタイル
Section titled “ギャラリースタイル”ギャラリースタイルは、各デバイスで顧客が商品メディアをどのように移動するかを制御します。複数画像のレイアウトは角度や詳細の比較をしやすくし、スライドショーはページをよりコンパクトにして焦点を絞れます。
デスクトップとモバイルのスタイルは個別に設定されるため、大きな画面ではより豊かなレイアウトを、小さな画面ではよりシンプルなレイアウトを使う余地があります。これは、モバイルでの閲覧を窮屈にせずに、デスクトップでは商品メディアにゆとりを持たせたい場合によく適した方法です。
ギャラリーを非表示にする場合は、商品ページのほかの部分で、顧客が何を購入しているのかを理解するのに十分な視覚的コンテキストが引き続き提供されていることを確認してください。
バリアント画像の動作
Section titled “バリアント画像の動作”バリアント画像の動作は、顧客が別のバリアントを選択したときにギャラリーで何が起こるかを制御します。ギャラリーを変更しないままにする、選択に合わせて先頭画像を更新する、またはギャラリーを選択されたバリアント画像のみに限定することができます。
先頭画像の更新は、ギャラリーの残りを削除せずに顧客の選択を反映できるため、通常は最も柔軟な選択です。各オプションに専用の写真があり、関係のないメディアを表示したくない場合は、選択されたバリアントのみを表示すると効果的です。
ズームの動作
Section titled “ズームの動作”ズーム設定では、商品画像がテーマ全体のズーム設定に従うか、ライトボックスで開くか、あるいはズームを完全に使わないかを制御します。これにより、顧客がギャラリーからどの程度まで細部を確認できるかを決められます。
ライトボックスズームは、質感、仕上げ、柄、職人技など、細かな視覚的ディテールが重要な場合に最も役立ちます。画像がより雰囲気重視であったり、すでに遠目から表示されていたりする場合は、ズームの価値はそれほど高くなく、よりシンプルにしておけます。
動画コントロールでは、ギャラリー内の動画を自動再生するか、ループするか、ミュートで開始するか、プレーヤーコントロールを表示するかを決められます。これらの設定は、商品メディア体験の中で動きがどれだけ目立つかに影響します。
自動再生は、特に動きが商品の説明に役立つ場合に、短い商品デモをより魅力的に見せることができます。ミュート再生は驚きを減らせるため、しばしば最も安全な選択です。また、顧客が長めのクリップを一時停止、再生し直し、またはシークしたい場合には、表示されるコントロールが役立ちます。
ループは、短い紹介動画に最も適しています。長いデモでは、ループが繰り返しになりすぎたり、気を散らしたりすることがあります。
使用上の注意
Section titled “使用上の注意”- 画像の構図を一貫させる。 ギャラリーがカタログ全体で意図されたものに感じられるよう、実際の商品写真に合うアスペクト比を選択してください。
- レイアウトを販売スタイルに合わせる。 視覚情報が判断を左右する場合はギャラリーにより多くのスペースを与え、商品詳細を同じくらい重視する必要がある場合は、よりバランスの取れた列を使用してください。
- 両方の表示領域を確認する。 スライダー形式のギャラリーはデスクトップとモバイルで動作が異なる場合があるため、両方の画面サイズでナビゲーション、プレビュー、間隔を確認してください。
- メディアの上書きは慎重に使う。 デスクトップとモバイルで異なるメディアを設定すると、特に小さい画面では、トリミング、読み込み、可読性に変化が生じることがあります。
- バリアントのみの動作は選択的に使う。 各オプションに十分で充実したメディアがある場合にのみ、ギャラリーを選択されたバリアントだけに制限してください。
- 自動再生には注意する。 ミュート動画と表示されるコントロールの組み合わせは、ページを煩わしく感じさせずに動きを加えたい場合、通常もっとも顧客に配慮した設定です。