# Multicolumn

{% embed url="<https://salesiq.zohopublic.in/signaturesupport.ls?widgetcode=siq93f38201da244cbe219b2cab71813c85342abc57dd769c6885e2bde57d2b90da>" %}

Cello theme provides a section, namely "Multicolumn" in this section. This section is used to add a column with a title,content and button. you can show the multicolumn image banner as a slideshow.

{% hint style="warning" %}
**Recommendation Size**\
Multicolumn banner image size: 356x278
{% endhint %}

<table><thead><tr><th width="306">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Heading</td><td>Enter text to display as a title in the section.</td></tr><tr><td>Heading size</td><td><p>Following is the font size customization of the heading of the section:</p><ul><li>Small</li><li>Medium</li><li>Large</li></ul></td></tr><tr><td>Description</td><td>Enter text to display as a description in the section.</td></tr><tr><td>Description style</td><td><p>Customization of the "Description style" in the Multicolumn section is as follows:</p><ul><li>Body</li><li>Subtitle</li><li>Uppercase</li></ul></td></tr><tr><td>Image width</td><td><p>Customization of the "Image width" in the Multicolumn section is as follows:</p><ul><li>One-third width of column</li><li>Half width of column</li><li>Full width of column</li></ul></td></tr><tr><td>Image ratio</td><td><p>In the section, Image size customization is as follows:</p><ul><li>Adapt to image</li><li>Portrait</li><li>Square</li><li>Circle</li></ul></td></tr><tr><td>Number of columns on desktop</td><td>"Number of columns on desktop" is to customize the column on the desktop screen. You can show a minimum of “3” and a maximum of “5” columns.</td></tr><tr><td>Enable carousel on desktop</td><td>Use "Enable carousel on desktop" to show the slider carousel on the desktop screen.</td></tr><tr><td>Image content alignment</td><td><p>Customization of "Image content alignment" as follows:</p><ul><li>Left</li><li>Center</li></ul></td></tr><tr><td>Content alignment</td><td><p>Customization of "Content alignment" as follows:</p><ul><li>Left</li><li>Center</li></ul></td></tr><tr><td>Content position</td><td><p>Customization of "Content position" as follows:</p><ul><li>Above image</li><li>Below image</li></ul></td></tr><tr><td>Button label</td><td>Use "Button label" to add a label to the Button in the section.</td></tr><tr><td>Button link</td><td>Use "Button link" to add a link to the Button in the section.</td></tr><tr><td>"View all" style</td><td><p>Customization of the "View all" style in the Multicolumn is as follows:</p><ul><li>Link</li><li>Outline button</li><li>Solid button</li></ul></td></tr><tr><td>Section background color scheme</td><td><p>In this section, you can change the background and foreground color of a section using the color scheme.</p><ul><li>Scheme 1</li><li>Scheme 2</li><li>Scheme 3</li><li>Scheme 4</li><li>Scheme 5</li></ul></td></tr><tr><td>Mobile layout</td><td><p><strong>Number of columns on mobile</strong></p><p>"Number of columns on mobile" is used for the customization of collection columns in Mobile devices.</p><ul><li>1 Column</li><li>2 Columns</li></ul><p><strong>Enable swipe on mobile</strong></p><p>The multicolumn slides when the checkbox is activated.</p></td></tr></tbody></table>

<figure><img src="https://959312205-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F28lMEJOSKsqmdpx3Cfa4%2Fuploads%2F1B3Cjk7jvo9Ul7JAemqo%2Fmulticolumn.png?alt=media&#x26;token=c583ebe2-0f4e-47ee-90df-2fa1c0d1493d" alt=""><figcaption></figcaption></figure>

## Add Column

To add column to the Multicolumn section, click on the 'Add column'. There are many options available , as you can see in the below points and screenshot.

<table data-full-width="false"><thead><tr><th width="282">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Color</td><td>Modifying the color setting you can change the background and foreground colors of a multicolumn's card.</td></tr><tr><td>Image</td><td>Use "Image" to add the image to the section.</td></tr><tr><td>Subheading</td><td>Enter the text you would like to display as a subheading on the image.</td></tr><tr><td>Heading</td><td>Enter text to display as a heading in the image.</td></tr><tr><td>Description</td><td>Enter text to display as a description below the image.</td></tr><tr><td>Description style</td><td><p>Customization of the "Description style" in the Multicolumn section is as follows:</p><ul><li>Body</li><li>Subtitle</li></ul></td></tr><tr><td>Button label</td><td>Use "Button label" to add a label to the Button in the section.</td></tr><tr><td>Button link</td><td>Use "Button link" to add a link to the Button in the section.</td></tr><tr><td>Button style</td><td><p>Customization of the "Button style" in the multicolumn is as follows:</p><ul><li>Link</li><li>Outline button</li><li>Solid button</li></ul></td></tr></tbody></table>

<figure><img src="https://959312205-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F28lMEJOSKsqmdpx3Cfa4%2Fuploads%2FODvnNVEblRmfDhMphVCf%2Fmulticolumn-blocks.png?alt=media&#x26;token=3ae34644-6b08-41b9-8b9a-d6ba4f3e3411" alt=""><figcaption></figcaption></figure>
