トップページで入れている画像バナーを小さくしたい

日本語 ディスカッション Shopify テーマ

Topic summary

DAWNテーマでトップページの画像バナーセクションが画面いっぱいに表示されてしまう問題について相談がありました。

問題点:

  • 画像バナーが画面全体に広がってしまう
  • CSSで画像幅を調整すると、縮小ではなく右側が切れてしまう
  • コレクションリストと同じ幅に揃えたい

解決方法:
画像バナーのカスタムCSSに以下のコードを追加:

.banner {
  max-width: 1200px;
  margin: 0 auto;
}

この方法で最大幅を1200pxに制限し、中央配置することで希望通りの表示が実現できました。質問者は解決を確認し、問題は解消されています。

Summarized with AI on October 29. AI used: claude-sonnet-4-5-20250929.
1

現在DAWNでページを作成しております。

画像バナーのセクションを追加して画像を入れているのですが、画面一杯になってしまうので、下記画像の様に縮小表示をしたいのですが、修正できません。

CSSで画像幅を小さくして見たのですが、画像が縮小するのではなく、表示範囲が右から切れてしまいました。

どなたかお力をお貸しいただけますと幸いです。

【実現したい事】

コレクションリストと同じ幅で画像を縮小したい。

【利用テンプレート】

DAWN

image_size.jpg
image_size.jpg1227×843 55.6 KB

2

@toot-pm 様

DAWNの画像バナーで最大幅を1200pxとした場合の調整ですが、

画像バナーのカスタムCSSに下記CSSを追加することで対応が可能かと思われます。

.banner {
  max-width: 1200px;
  margin: 0 auto;
}

ご参考まで。

（キュー小坂）

3

早速の回答ありがとうございました。

思い通りの設定となりました！