FROM CACHE - jp_header
解決済

商品画像を 1:1 で表示させたい。

Bacchus
観光客
4 0 3

Colorblockというテーマを使用しています。

こちらのテーマですと商品一覧で見たときに、サムネイル画像が縦長に表示されます。

商品画像は全て正方形で作成しているため、長方形で表示された時に両端の画像が不自然に切り取られてしまい困っています。

どうしたらサムネイル画像の縦横の比率を変更できるでしょうか?

2023-04-11 123139.png

1 件の受理された解決策

株式会社フルバランス
Shopify Partner
1468 519 651

成功

Bacchus様

 

ご質問を確認いたしました。

 

Colorblockというテーマをプレビューにて確認したところ、

商品画像が縦横5:4の比率で表示されていることがわかりました。

 

実際にコード編集はしていないですが、cssを確認したところ、

以下コードをcssファイルに追記することで比率を1:1にできるかと存じます。

.card__inner.gradient.ratio {
  --ratio-percent: 100%!important;
}

ご参考までに。

株式会社フルバランス(Shopify Experts)
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『すべてのブランドの特大成長エンジンを搭載する』 株式会社フルバランス

元の投稿で解決策を見る

2件の返信2

株式会社フルバランス
Shopify Partner
1468 519 651

成功

Bacchus様

 

ご質問を確認いたしました。

 

Colorblockというテーマをプレビューにて確認したところ、

商品画像が縦横5:4の比率で表示されていることがわかりました。

 

実際にコード編集はしていないですが、cssを確認したところ、

以下コードをcssファイルに追記することで比率を1:1にできるかと存じます。

.card__inner.gradient.ratio {
  --ratio-percent: 100%!important;
}

ご参考までに。

株式会社フルバランス(Shopify Experts)
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『すべてのブランドの特大成長エンジンを搭載する』 株式会社フルバランス
Bacchus
観光客
4 0 3

ありがとうございます。

商品画像がキッチリ正方形になりました!