カラムの活用方法

1〜5カラムと横幅を自由に変えれます。ノーコードでデザインを調整をしていくことが可能です。

カラムとは

カラムとは、ブロックの中の「列」のことです。1〜5カラムまで、横幅を自由に変えられます。
ノーコードで、見やすく分かりやすいレイアウトを作れます。

① カラムの幅を調整する

カラムとカラムの間にある青い線をクリックして、左右に動かします。
上に各カラムの幅が「％」で表示されるので、見ながら割合を調整してください。

② カラムの内側の余白を調整する

カラムにマウスを乗せると、ふちの内側に薄い色の部分が表示されます。ここが、カラムの枠と中身（テキストやボタンなど）の間の余白です。
この部分をドラッグすると、余白の広さを変えられます。
中身のまわりにすき間を作って、バランスを整えたいときに使います。

③ カラムを追加する（段を増やす）

1つのブロックの中に、カラムの段を複数作れます。
例：2カラムの上に、見出し用の1カラムを追加する

1. 「＋」をクリックします。
2. 新しいカラムの段が追加されるので、見出しなどを入れます。
3. 必要に応じて、①の方法で幅を調整します。

段と段の間のすき間を空けたいとき
段と段の間のすき間は、そのままでは調整できません。【要確認：行設定の「列の間隔」との関係】
すき間を空けたいときは、カラムの中に「スペーサー」を入れて調整しましょう。

④ カラムの設定を変える

カラムの上のラベルをクリックすると、カラムの設定画面が開きます。カラムごとに、次のような設定ができます。
背景

• 背景画像：カラムの背景に画像を入れて、その上に文章をのせられます
• オーバーレイ：背景画像の上に色を重ねて、文字を読みやすくできます
• 背景の位置：背景画像のどこを見せるかを調整できます
• 背景色：画像を使わない場合は、色だけを付けることもできます

境界線（カラムの外側の線）

• 線の色・太さを設定できます
• 角を丸くすることもできます

影

• 影を付けると、カラムが浮き上がったように立体的に見えます

⑤ カラムの位置をずらす

カラムを上下にずらして配置できます。【要確認：操作する項目名と手順】
3つのカラムを少しずつずらすと、階段状に並んだ動きのあるデザインになります。背景色を付けておくと、ずれ方が分かりやすくなります。

ご注意ください

• カラムだけをコピーすることはできません。 コピーはブロック単位になります。同じカラムを使いたいときは、ブロックごとコピーしてください。

ページビルダー一覧

ページビルダー概要

ページの追加方法

ブロックの活用方法

ウィジェット追加方法

SEOの設定方法

スマホサイズのデザイン設定方法

購入者限定ページの作成手順

ポートフォリオ機能で商品一覧・顧客の声を作成！

ヘッダーを活用してホームページのメニューを最適化しよう！

コピー（複製）の仕方（ウィジェットやブロック）

フッターを活用してユーザーを誘導しよう！

ページへのアクセス設定

AIで作ったLPやウェブサイトをコネワンに表示させる方法

ファビコンとSNS共有画像

ファイルマネージャー

ブロックをスライダーで表示する方法（スライダーモード）

ブロックの表示設定（見る人・日時・国などで表示を切り替える）

カラムの基本設定

グローバルカラムの設定

カラムをタブで切り替えて表示する方法（タブモード）

カラムをスライダーで表示する方法（スライダーモード）

更新日 19/09/2026