Multicolumn settings

Setting	Description
Heading	To add a main section heading, simply enter the text in the provided field. In the top menu of the field, you can find options to customize the heading such as making it bold, italic, or adding a hyperlink. Furthermore, you can click the dynamic source button to insert a dynamic source for the featured collection description.
Heading alignment	You have three alignment options for the heading to choose from: Left: Aligns the heading to the left side of the section. Center: Aligns the heading to the center of the section. Right: Aligns the heading to the right side of the section.
Heading size	The heading size setting offers three options to control the size of the section heading: Small Medium Large
Description	To add a description after the main section heading, simply enter the text in the provided field. In the top menu of the field, you can find options to customize text. Furthermore, you can click the dynamic source button to insert a dynamic source for the featured collection description.
Description font size	Choose the font size for descriptions: Small Medium Large
Image width	Choose what width of the column will take the image : Quarter width of column One-third width of column Half width of column Three quarters width of column Full width of column
Image ratio	The “Image ratio” setting allows you to control how images are displayed on your website based on their width-to-height ratio. You have several options to choose from: Adapt to image: This option uses the aspect ratio of the images, ensuring that they are not cropped and displayed in their original dimensions. Portrait: This option crops the images to use a 2:3 ratio, creating a taller appearance with a width that is 2/3 of its height. Square: This option crops the images to use a 1:1 ratio, creating a square-shaped display with equal width and height. Circle: This option crops the images and transforms them into circles, making them appear as circular images.
Number of columns on desktop	The “Number of columns on desktop” setting allows you to choose the number of columns in which your content will be displayed on larger screens, and on tablets. You can select from 1 to 6.
Grid type	Arranges items one after another in a row-wise direction. The first block is the highest, the next one is lower, and the subsequent one is the lowest. This staggered arrangement creates a visually dynamic layout.
Column divider	When you add columns with the same background color, you can visually separate them using this option, which adds lines between each column. Note: It is recommended to use this option when Image Cover, Hide inner spaces are disabled, also section and column block background are the same.
Column alignment	Choose left or center alignment of the column.
Secondary background	This setting allows you to choose a background for a column. If you select “Show as column background” you'll need to choose a different section background in color scheme to see changes: None Show as column background *Color scheme of column can be changed in column block settings.
Button label	To make the button visible on the page, you need to add a label to it. The label is the text that appears on the button and gives it a purpose or indicates the action it performs. Without a label, the button will be hidden and not visible to users on the page.
Button link	To set a button link, you can enter the link URL directly into the “Button link” field or select a page from the dropdown list of options that appears when you click on the field.
Color scheme	Applying a color scheme to the multicolumn section automatically updates all associated colors set in the theme settings according to the created color schemes. You can edit colors in this block, but it will impact the other sections and blocks in which the same color scheme is used. Learn more about color schemes.

Mobile layout

Setting

Description

Number of columns on mobile

Select the preferred column layout for mobile devices:

1 column
2 columns

Enable swipe on mobile

Check this box to display products in a carousel format on screens narrower than 989 pixels.

Section paddings

Setting	Description
Top padding	The “Top padding” setting allows you to adjust the amount of space at the top of the section using a slider.
Bottom padding	The “Bottom padding” setting functions similarly to the “Top padding” setting, but controls the space at the bottom of the section.

Multicolumn can be attached to the footer. It can scroll in an interesting way with rounded borders, which can be adjusted in the footer settings.

You can add multicolumn in this way: