FROM CACHE - jp_header
このコミュニティはピアツーピアサポートに移行しました。Shopify サポートは今後、このコミュニティへのサービスを提供いたしません。これからもぜひ、他のマーチャントやパートナーとつながり、サポートし合い、経験を共有してください。 当社の行動規範に違反する行動や削除を希望するコンテンツがありましたら、引き続きご報告ください

テキスト付き画像のモバイル表示位置について

解決済

テキスト付き画像のモバイル表示位置について

HUHU1
Shopify Partner
8 0 1

"Ride"の無料テーマを使用しています。"テキスト付き画像"をデスクトップで表示させる場合、右か左の画像配置を選択できます。モバイル表示だと画像は、タイトル、文章の上にのみ配置され、移動させることが出来ません。モバイル表示時に画像を、タイトル・文章の下に表示させることは可能でしょうか。・

1 件の受理された解決策

株式会社フルバランス
Shopify Partner
1622 576 750

成功

HUHU1様

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

Rideテーマの"テキスト付き画像"をモバイルの際に画像とタイトル・文章の位置を逆にするためには、カスタムCSSを追加する必要があります。
下記、コードの一例となります。
 

 

@media screen and (max-width: 749px) {
  .grid--gapless.grid {
    flex-direction: column-reverse;
  }
}

 

スクリーンショット 2024-02-26 15.04.54.png 

 

参考になれば幸いです。

私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。
株式会社フルバランス
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『つくる人、売る人の成長と成功を最大化する。』 株式会社フルバランス

元の投稿で解決策を見る

2件の返信2

株式会社フルバランス
Shopify Partner
1622 576 750

成功

HUHU1様

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

Rideテーマの"テキスト付き画像"をモバイルの際に画像とタイトル・文章の位置を逆にするためには、カスタムCSSを追加する必要があります。
下記、コードの一例となります。
 

 

@media screen and (max-width: 749px) {
  .grid--gapless.grid {
    flex-direction: column-reverse;
  }
}

 

スクリーンショット 2024-02-26 15.04.54.png 

 

参考になれば幸いです。

私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。
株式会社フルバランス
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『つくる人、売る人の成長と成功を最大化する。』 株式会社フルバランス
HUHU1
Shopify Partner
8 0 1

解決しました!どうも有難うございました!