![](https://starting-marketing.com/wp-content/uploads/2021/11/aditya-chinchure-wmkPVpQlZSc-unsplash-1024x599.jpg)
この記事ではCocoon設定の【カラム】のタブについて解説していきます。
ここでは、サイト全体の列や幅、余白などを設定していきます。
サイドバーの幅の設定やメインコンテンツの幅、そしてサイドバーとメインコンテンツとの距離などを設定することができます。
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-12-3-1001x1024.jpg)
この「カラム」の項目についてはワードプレスに使い慣れてきてからお好みで設定してみてください。
ブログを始めて間もない方は、最初は全てデフォルトのままで問題ありません。
メインカラム設定
【メインカラム設定】では、主にメインとなる投稿記事が表示される幅を調整する項目になります。
![](https://starting-marketing.com/wp-content/uploads/2021/11/b43cb64334547eb2c2c3298aaea1393a.jpg)
プレビュー
![](https://starting-marketing.com/wp-content/uploads/2021/11/b94006ac7e28e972fffe75509d714ff0.jpg)
【プレビュー】では、現在のカラム状態を確認するために、トップページが表示されるようになっています。
編集する際は、常に確認しながら作業を進めていきましょう。
コンテンツ幅
![](https://starting-marketing.com/wp-content/uploads/2021/11/62588de2e75a6415b45ec2eba6483bf6.jpg)
【コンテンツ幅】の項目では、表示される投稿記事部分の幅を600pxから1600pxの間で設定することができます。
・600px
![](https://starting-marketing.com/wp-content/uploads/2021/11/c181be0d9f475aeee310b81ff6b91779-1024x439.jpg)
・1600px
![](https://starting-marketing.com/wp-content/uploads/2021/11/d2dadc620877533f847ca801246ac473-1024x343.jpg)
コンテンツ余白幅
![](https://starting-marketing.com/wp-content/uploads/2021/11/5567caf0a4d33596b24f0b078bb30a03.jpg)
【コンテンツ余白幅】は、メインとなる投稿記事の両サイドの余白をどのくらい作るかを設定します。
コンテンツ枠線幅
![](https://starting-marketing.com/wp-content/uploads/2021/11/2b670897cbe6797e33768f37c8d95e95.jpg)
【コンテンツ枠線幅】では投稿記事部分を囲む線の太さを設定します。
・1px
![](https://starting-marketing.com/wp-content/uploads/2021/11/118e2332e6d3010c19bed7a112525eaa.jpg)
・10px
![](https://starting-marketing.com/wp-content/uploads/2021/11/95b82bbbf352575c30624a5bb68f84e4.jpg)
コンテンツ枠線色
![](https://starting-marketing.com/wp-content/uploads/2021/11/c51bd5aa84efd4eaab6d6f4abdee42f6.jpg)
【コンテンツ枠線色】は、上で決めた投稿記事部分を囲む線幅の色を設定します。
サイドバー設定
次に【サイドバー設定】の項目になります。項目は【メインカラム設定】と同様です。
![](https://starting-marketing.com/wp-content/uploads/2021/11/65307eb2725859137af7de69950ce98f.jpg)
サイドバー幅
![](https://starting-marketing.com/wp-content/uploads/2021/11/cb0d61487079a69869e4fb35072321a4-1.jpg)
【サイドバー幅】はサイドバーの幅を200pxから500pxの間で設定することができます。
・200px
![](https://starting-marketing.com/wp-content/uploads/2021/11/4d1c470f672a1ca07d75ee5b678beb03.jpg)
・500px
![](https://starting-marketing.com/wp-content/uploads/2021/11/0a82c165ce11d30ea88e1b2137ae5d4e.jpg)
サイドバー余白幅
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-12.png)
【サイドバー余白幅】はサイドバーの両サイドの余白を5pxから40pxの間で設定することができます。
サイドバー枠線幅
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-13.png)
【サイドバー枠線幅】はサイドバーを囲む線の太さを0pxから10pxの間で設定することができます。
サイドバー枠線色
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-16.png)
【サイドバー枠線色】はサイドバーを囲む線の色を設定します。
カラム間余白設定
![](https://starting-marketing.com/wp-content/uploads/2021/11/image-15.png)
【カラム間余白設定】では、投稿記事とサイドバーとの間隔をどのくらい開けるかの設定になります。
![](https://starting-marketing.com/wp-content/uploads/2021/11/32f10e0544f6dd0f934aca1e679071fa.jpg)
・0px
![](https://starting-marketing.com/wp-content/uploads/2021/11/d0801638fc1c0089835e2ece31307ff3.jpg)
・60px
![](https://starting-marketing.com/wp-content/uploads/2021/11/0eb798b0c1beb657aaa21b3935766693.jpg)