テーマandamanでイメージバナーをトップページに入れているのですが、
イメージのサイズを最大のLargeにしているのですが、パソコンで表示する際、Large以上の高さを出したい場合、
コード編集をしたいのですが、どこを編集すればいいのでしょうか。
モバイルで表示した時は理想の高さになっていたので、パソコンで表示される時の高さだけを調整したいです。
お手数おかけ致しますが、何卒よろしくお願いいたします。
Topic summary
Andamanテーマでトップページのイメージバナーの高さをPC表示時のみ調整したいという質問。
現状の課題:
- 画像サイズを最大のLargeに設定しているが、PC表示時にさらに高さを出したい
- モバイル表示は理想的な高さになっている
解決方法:
Qcoltd様から以下の手順が提案されました:
- 管理画面 > オンラインストア > カスタマイズ
- 対象のImage bannerを選択
- カスタムCSS欄にメディアクエリを使用したCSSコードを追加
提案されたコードは、PC画面(min-width: 765px以上)でのみ適用され、min-height: 120vhで高さを指定。高さは任意に変更可能で、pxでの指定も問題なし。
結果:
質問者は解決し、感謝のコメントで終了。
@Anonymous_238dd7b1c030c8aa2ccf71a03c9b83ce 様
ご質問いただたいている、PCの際イメージバナーの高さを広げたい件ですが、下記のように変更すれば対応できるのではと思われます。
設定方法
- 管理画面 > オンラインストア > カスタマイズをクリック
- 対象のImage bannerをクリック
- カスタムCSS欄に下記CSSを追加
@media (min-width: 765px) {
.image-banner-block-content {
min-height: 120vh !important;
}
}
※120vh部分を任意の高さに変更ください。
高さの指定はpxでの指定でも問題ありません。
ご参考まで
(キュー小坂)
ありがとうございます！
助かりました！