Text / Image Split

A side-by-side section with a text column (tag, title, rich text, buttons) and a media column (image or video). Two width modes — Constrained (10/12 wrapper, 10-column grid) and Wide (full 12-column grid) — control how much horizontal space the section uses. In wide mode, the media can bleed past the container edge to the viewport boundary.

Content can be entered manually using blocks, or pulled from a text_image_split metaobject via the content source picker. The metaobject overrides layout settings (media position, width, alignment) alongside content fields, so each entry is self-contained. On product pages, connect the picker to nama.product_text_image_split via dynamic source to show per-product content automatically.

Settings

Setting	What it does
Section ID	Optional anchor for jump links.
Content source	A text_image_split metaobject. Connect via dynamic source on PDP. Overrides all content and layout settings when present.
Media position	Left or right on desktop. Default right.
Media position (mobile)	Top or bottom on mobile. Default top.
Media full bleed	Extends the image to the viewport edge. Only available in wide mode.
Content width	Constrained (10/12 wrapper, narrower media) or Wide (full width, larger media). Default constrained.
Text alignment	Left, center, or right. Default left.
Vertical alignment	Top, center, or bottom — controls where the text sits relative to the media. Default center.
Padding top / bottom	Default 48/64/80px each.

Blocks

Static blocks:

• Tag — small label above the title
• Title — the section heading
• Rich text — body copy below the title
• Media — the image (with optional mobile override) in the media column

Repeatable:

• Buttons — call-to-action buttons below the text
• Embed — custom embed code (e.g. Klaviyo form)
• YouTube Video — inline YouTube embed

Metaobject content replaces static blocks

When a metaobject is connected, its tag, title, body, and button fields override the static block values. The media block is also overridden by the metaobject’s image. Theme blocks (buttons, embed, YouTube) still render below the metaobject content.

Auto-hide on PDP

On product pages, the section hides entirely when no metaobject content source is connected. On other page types it always renders. This lets you add the section to the product template once and it only appears for products with a text_image_split metaobject assigned.

Where it’s used

Product pages (via nama.product_text_image_split dynamic source), homepage, and any content page needing a text-plus-image layout.

Tips

• Constrained mode looks better for body-heavy content. The narrower grid keeps line lengths readable without needing to adjust font sizes.
• Wide + full bleed is for hero-adjacent moments. Use it sparingly — it dominates the page.
• The metaobject carries its own layout. Media position, width, and alignment travel with the content, so the same section instance can look different per product without any manual override.
• Mobile media position defaults to top. Most visitors scroll past an image faster than text, so leading with the visual works well on phones.