"Ride"の無料テーマを使用しています。"テキスト付き画像"をデスクトップで表示させる場合、右か左の画像配置を選択できます。モバイル表示だと画像は、タイトル、文章の上にのみ配置され、移動させることが出来ません。モバイル表示時に画像を、タイトル・文章の下に表示させることは可能でしょうか。・
Topic summary
問題: Shopifyの無料テーマ「Ride」で「テキスト付き画像」セクションを使用する際、デスクトップでは画像の左右配置を選択できるが、モバイル表示では画像が常にタイトル・文章の上に固定され、配置を変更できない。
解決策: カスタムCSSを追加することで対応可能。具体的には以下のコードを使用:
@media screen and (max-width: 749px) {
.grid--gapless.grid {
flex-direction: column-reverse;
}
}
このコードにより、モバイル表示時に画像とテキストの順序を逆転させることができる。
結果: 質問者は提案された解決策で問題を解決。
HUHU1様
ご質問確認いたしました。
Rideテーマの"テキスト付き画像"をモバイルの際に画像とタイトル・文章の位置を逆にするためには、カスタムCSSを追加する必要があります。
下記、コードの一例となります。
@media screen and (max-width: 749px) {
.grid--gapless.grid {
flex-direction: column-reverse;
}
}
参考になれば幸いです。
私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。
分からない点があれば、またいつでもご連絡ください。
1 Like
解決しました！どうも有難うございました！