WordPressテーマSANGOの質問

横並び2列にするショートコードのレイアウトを1:1ではなく1:2にしたい

アバター
クリーム

お世話になっております。
[yoko2 responsive][/yoko2]を使って画像や文章のレイアウトを1:1に表示するショートコードを設けていただいておりますが、こちらの比率を1:2にすることは可能でしょうか?
例えば、小さめの画像を左に置いて詳細の文章を右に書くということをしたいと思っております。
解決方法を検索し、自分なりにphpやcssを工夫してみたのですが実現できませんでした。
お忙しいところ恐縮ですが、もし解決策がありましたらご教示ください。

SANGOのショートコード一覧
SANGOのショートコード一覧
コメントへの回答
サルワカくん
サルワカくん
2019/06/05

なるほど。その場合、レスポンシブにしない方が良いかと思います(小さい端末で横並びを維持した方がきれいに見えるかと思います)。

以下のCSSを外観⇒カスタマイズ⇒追加CSSに貼り付けておきます。

.shtb2:not(.tbrsp) .cell:first-of-type {
  width: 33%; /* 左側の幅 */
}
.shtb2:not(.tbrsp) .cell:last-of-type {
  width: 66%; /* 右側の幅 */
}

これでショートコード[yoko2]〜[/yoko2]を使ったときに1対2の比率になります(responsiveという文字列を含めなかった場合にのみ1:2になります)。

アバター
クリーム
2019/06/05

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

教えていただいたとおりに編集したところ、画像と文章が1:2で表示されました。
素敵なテーマをありがとうございます。今後も使わせていただきます。

サルワカくん
サルワカくん
2019/06/06

うまくいったようで良かったです!
ご報告ありがとうございます。