２カラムの並びで、スマホでの表示順が変更したい

  • M

    いつもありがとうございます。
    質問なのですが、PC で２カラムを設定したのち、左画像、右文章
    その下にまた２カラムで左文章、右画像とすると、
    スマホでは画像⇨文章⇨文章⇨画像の順番となってしまいます。
    PC の位置関係はかえず、スマホの表示順を変更するにはどのようにすればよろしいでしょうか。CCS等の記入変更で可能でしょうか。すみません、よろしくお願いいたします。

    WordPressのバージョン :
    ご利用のサーバー名 :
    PHPのバージョン :
    OS :
    ご利用のブラウザ :
    該当サイトのURL :

    0 1 件の返信

  • @ma-ru さん

    こんにちは！

    ２カラムを設定したのち

    というのは「カラムブロック」を使っている状態でしょうか？？

    追加CSSの記入だけでは難しそうですね。。。
    やり方はいくつかありますが、

    ●編集画面から順番を入れ替えたいブロックの「高度な設定」>「追加CSSクラス」でクラス名を追加
    　　↓
    ●追加CSSでそのクラスに対して、スマホの時に順番が入れ替わるようにスタイルを記入

    といった流れになるかと思います。

    おそらく、↓ こんな感じのコードになるはずです。

    @media (max-width: 599px) {
	.my-reverse-column__text {
		order: 1;
	}
	.my-reverse-column__image {
		order: 0;
	}
}

    ⠀

    こちらの記事の内容が参考になるかもしれません。
    https://diy.ushaken.com/webs/wordpress/1127/
    ⠀
    ⠀
    ご参考になりましたら幸いです！

    カスタマイズにつきましてはサポートの対象外となっておりますので、
    ma-ru さんご自身でカスタマイズが難しそうであれば、別途、有識者の方にご依頼いただければと存じます。

    お手数おかけしますが、よろしくお願いいたします！

    0
    M
     1 件の返信
  • M

    @tsu_
    ご返信ありがとうございます。実施させていただきます！！

    0 1 件の返信

  • @ma-ru さん

    よろしくお願いいたします！

    解決済みにさせていただきますね。
    また何かありましたら、お気軽にご相談いただければと思います！

    （ご確認いただければ、ご返信には及びません）

    0
    M
     1 件の返信
  • M

    @tsu_ さん
    ありがとうございました。

    0