レイアウトブロック

目次

カラムとは?

Swellには2つのカラムがある

カラム

カラムの幅は設定で変更でき、1:2や1:1などの幅の調整ができます。

リッチカラム

リッチカラムでは比率を変更することができず、均等並びで表示できます。

カラム(Wordpressのデフォルトのブロック)

カラムの幅は設定で変更でき、1:2や1:1などの幅の調整ができます。

カラムの例

50%:50%の場合

テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。

30%:70%の場合

テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。

リッチカラム(Swellのブロック)

リッチカラムでは比率を変更することができず、均等並びで表示できます。

リッチカラム使用時の注意点

Swellのテーマに搭載されている機能です。リッチカラムは立地からの進化版であり、パーツの数を増やすことができます。

  • カラムはパーセント指定が可能で、幅の制御が細かくできます。
  • カラムは2段になり、左側に画像、右側に表が入ります。
  • カラムは予めの大きさが決まっている場合に使います。
  • リッチカラムのでカラムの追加や削除ができます。
  • カラムは等間隔で表示される
  • PCやタブレット、スマホでそれぞれの列数を指定できる

レイアウトの例

PC2列、タブレット2列、スマホ2列のレイアウト

テキストが入ります。テキストが入ります。

テキストが入ります。テキストが入ります。

テキストが入ります。テキストが入ります。

テキストが入ります。テキストが入ります。

PC4列、タブレット2列、スマホ1列のレイアウト

テキストが入ります。テキストが入ります。

テキストが入ります。テキストが入ります。

テキストが入ります。テキストが入ります。

テキストが入ります。テキストが入ります。

目次