Multiple columns
A way to showcase image cards of the same style in rows
Steps:
In the theme editor (Customize), click Add section
Select Multiple columns
Make necessary changes
Save the settings.
Section settings
Section header
Select the header layout (on the Left of the whole cards or the Top).
Give the section a heading, description, and a button. Leave any fields blank if you don't want to show them.
You can also set the alignment of your section header's button.
Card settings
Cards' content alignment: Left/Center/Right;
Show border
Image width: Extra small/ Small/ Medium/ Large/ Extra large/ Full width;
Image rounded: 0-100 px;
Heading size: H2-H6;
Description style: Body text/ Sub text;
Image hover effect: None/ Scaling up.
Grid settings
Set the number of columns for desktop view (2-12 columns) and adjust the gap between the columns and rows.
Slider settings
Enable the slider for the section if needed (the number of cards > the number of columns).
Show the navigation and/or pagination to navigate the columns.
Mobile settings
Set the number of columns on mobile view: Inherit/ 1 column/ 2 columns.
You can also make the section swipeable.
Then, adjust the gap of the columns and rows on mobile (between 0-50px).
Block settings
Link your card to your desired page. Visitors will be directed to your attached page when clicking on the image or the button.
Select an image and insert its content (heading and description).
Give your button a label and select the button style.
Last updated