Image with Text Section

A versatile two-column layout combining an image with text content, perfect for brand stories and feature highlights.

Adding the Section

Open the theme editor
Click Add section
Select Image with Text

Layout Options

Image Position

Choose which side the image appears:

Left - Image on left, text on right
Right - Image on right, text on left

Desktop Split Ratio

Control column widths on desktop:

50/50 - Equal columns
60/40 - Larger image, smaller text area

Mobile Image Position

On mobile, columns stack vertically:

Top - Image appears above text
Bottom - Image appears below text

Image Settings

Selecting an Image

Add an Image block to your section
Click Select image
Upload or choose from library

Image Ratio

| Option | Best For | |--------|----------| | Adapt | Uses image's natural ratio | | 1:1 | Square images | | 3:4 | Portrait photos | | 4:5 | Tall portraits | | 3:2 | Landscape photos |

Content Blocks

Add blocks to build your content:

Subheading

Small text above the heading, useful for:

Section categories
Product types
Campaign names

Heading

Main section title with size options:

H1 - Largest (use sparingly, once per page)
H2 - Section headings (default)
H3 - Subsection headings
H4 - Smaller headings

Text

Rich text paragraph for your message. Supports:

Bold and italic text
Links
Lists

Button

Call-to-action button with options:

Label - Button text
Link - Destination URL
Style - Primary, Outline, or Underline
Arrow - Optional animated arrow icon

Content Alignment

Align text within the content column:

Left - Left-aligned text (default)
Center - Centered text
Right - Right-aligned text

Reveal Animation

Content can animate into view on scroll:

Animations must be enabled in Theme settings
Section animates when scrolled into view
Elements reveal with staggered timing

Color Scheme

Select a color scheme to style:

Background color
Text color
Button colors

Use Cases

Brand Story

Lifestyle image
Heading: "Our Story"
Text about your brand's mission
Button: "Learn More"

Product Feature

Product detail shot
Feature name heading
Description of benefits
Button: "Shop Now"

Collection Intro

Collection imagery
Collection name
Description of the collection
Button: "View Collection"

Best Practices

Image Quality

Use high-resolution images (1000px+ width)
Ensure good contrast for adjacent text
Consider how image crops at different ratios

Content Length

Keep headings concise (3-8 words)
Limit paragraphs to 2-3 sentences
One clear call-to-action

Visual Balance

Balance image visual weight with text amount
Use appropriate split ratio for content length
Test on mobile for readability

Image with Text