Multicolumn

Show content side by side in columns with images, videos or icons. Great for highlighting your values, how your company works or key product benefits.

---

InspiredTheme includes four Multicolumn sections. They all show a row of columns, but each has a different card style:

Section	What it shows	Plan
Multicolumn: Media	Columns with an image or video, heading, text and link.	All plans
Multicolumn: Icons	Columns with an icon (or your own small image), heading, text and link.	All plans
Multicolumn: Cards	Image or video cards with text laid over the media, plus product tags that open a Shop the look popup. Read the Multicolumn: Cards guide	Pro
Multicolumn: Reveal	Image or video cards with a heading; shoppers tap + to reveal more text. Read the Multicolumn: Reveal guide	Pro

This article covers Multicolumn: Media and Multicolumn: Icons.

1. Our guide to set up a Multicolumn section:

Steps:

• In the theme editor, click Add section.

• Locate Multicolumn: Media or Multicolumn: Icons.

• Click Save.

Each section is added with three columns. Click Add block to add more, or drag them to reorder.

2. Multicolumn: Media section settings

• Section header

  • Heading: The title shown above the columns. Leave it blank to hide it.

  • Heading size: 15–80px.

  • Heading alignment: Left / Center.

• Button

  • Button label and Button link: A button shown below the columns. Leave the label blank to hide it.

• Card settings

  • Image width: Width of the image inside each column, 10–100%.

  • Image ratio: Crops every image to the same shape: Adapt to image / Portrait / Square / Circle / Reel (9:16) / Landscape / Arch / Fluid. Adapt to image keeps each image's original shape.

  • Column alignment: Left / Center.

  • Number of columns on desktop: 2–6.

  • Enable carousel on desktop: Turns the row into a slider when there are more columns than Number of columns on desktop.

• Colors

  • Color scheme: The section background.

  • Container color scheme: The background of each column.

• Mobile layout

  • Number of columns on mobile: 1 column / 2 columns.

  • Enable swipe on mobile: Turns the columns into a swipeable slider on phones. Sliders always show 1 column.

• Corner radius

  • Card: 0–40px.

• Section padding

  • Top padding and Bottom padding: 0–100px.

Column block

• Image: The column's image.

• Video: A Shopify-hosted video. If you set both, the video is shown instead of the image. It plays automatically, without sound.

• Heading: The column's title. Heading size: 15–60px.

• Description: The column's text.

• Link label and Link: A text link below the description. Leave the label blank to hide it.

3. Multicolumn: Icons section settings

The settings are the same as Multicolumn: Media, except:

• There's no Image width or Image ratio.

• Column padding: Space inside each column, 20–80px.

• Column alignment is Center by default.

• Corner radius applies to the Column container.

Icon block

• Icon: Choose from 30 built-in icons, or None.

• Alternative icon/image: Upload your own icon or small image. It replaces the built-in icon.

• Icon size: 30–150px.

• Heading: The column's title. Heading size: 15–60px.

• Description: The column's text.

• Link label and Link: A text link below the description.

4. Tips

• Use Multicolumn: Icons for quick benefit rows such as free shipping, returns and secure checkout, and Multicolumn: Media when each column needs a photo or video.

• Set Image ratio to Square, Circle or Portrait so columns line up even if your images are different sizes.

• Use a different Container color scheme from the section's Color scheme to show each column as a card.