Image with text

Pair an image beside rich text in a horizontal split — a dedicated section, not a Multicolumn block.

Last updated 18 days ago

The Image with text section places media and copy side by side. It supports up to four blocks (typically one Image and one Rich text). For a vertical image-plus-text card inside a multi-column grid, use the Multicolumn section instead.

Arrange the layout

  • Stack on mobile — image above or below text on small screens.
  • Stack on desktop — vertical layout on large screens too.
  • Content alignment — vertically align blocks to top, middle, or bottom.

Block order in the sidebar controls left-to-right placement when not stacked.

Arrange images differently on mobile and desktop

Block order sets the same sequence on every screen. To put the image on one side on desktop and the other on mobile, add an extra Image block and use per-block Visibility settings to hide the copy each device should not see.

Example: text left and image right on desktop; image above text on mobile

  1. Add three blocks in this order: Image, Rich text, Image.
  2. Use the same image and matching settings in both Image blocks.
  3. Select the first Image block. Under Visibility settings, set Visibility to Hide on desktop.
  4. Select the last Image block. Set Visibility to Hide on mobile.

On desktop, the first image is hidden — visitors see Rich text then Image. On mobile, the last image is hidden — visitors see Image then Rich text. Turn on Stack on mobile if you want the blocks stacked vertically on phones.

For other arrangements, order the blocks for the layout you want on one device, then hide the blocks that would break the layout on the other. The section supports up to four blocks.

Configure the image block

The Image block includes Image style (default, rounded corners, or circle), Aspect ratio, Max image width, Link, caption, overlay color, and alignment.

Configure the rich text block

The Rich text block holds your heading, body copy, and an optional button — with text alignment, icon, heading size, and button style settings.

Other settings

Turn on Show header for a section title above the split. Color scheme, Padding settings, Visibility settings, and Width settings.