Photo Feature

Usage

The Photo Feature block puts photography center-stage with a print-magazine layout: a full-bleed background image, overlaid headline and body copy, and an optional link button. Content options are intentionally limited — headline, paragraphs or lists, and one button — so the photo stays the focus.

The block is part of the Media & Text suite. Use Photo & Text for a simpler side-by-side layout, or Call To Action when you need column sizing and container styling.

Layout

• Background Image — full-bleed photo behind all content (sidebar Background Image + BG Focal Point)
• Content Origin — places the text panel on the Left or Right half of the image. Unlike some blocks, this side preference is respected on mobile as well.
• Content Width — Full spans the content area edge to edge; Wide constrains it to the wide content width

The headline always renders as an <h3> element for semantics. Headline Style controls the visual typography preset (h1–h6 or paragraph) from your Customizer — appearance only, not the HTML tag.

Style

Two presentation modes affect how text sits over the photo:

• Seamless (default) — text integrates with the image using a directional gradient behind the content panel. Darkening controls gradient strength (0–100%). With reverse print enabled the gradient runs black; disabled, white.
• Boxed — removes the gradient and places content on a solid overlay panel with rounded corners (from your site border-radius setting). Overlay color inverts with reverse print: light text gets a dark panel, dark text gets a light panel. Darkening controls overlay opacity.

Content

• Headline — edit inline in the editor or in the sidebar
• Body copy — paragraph and list blocks only; keep to a few sentences
• Button Link — set a URL in the sidebar or toolbar to reveal the button; edit button text inline (defaults to "Learn More")
• Link Style — Button or Understated

Appearance

• Text Color (reverse print) — light or dark text; toggles from sidebar or White Text toolbar button. Defaults to light text for readability over photos.
• Headline Style — Customizer typography preset for the headline
• Darkening — gradient strength (Seamless) or overlay opacity (Boxed), 0–100%

Enable reverse print whenever text needs to read clearly over a dark or busy photo.

Block width

Photo Feature supports Wide and Full alignment from the block toolbar and defaults to Full width so the background image spans the viewport.

Tips

• Set BG Focal Point so the subject stays visible when the image crops at different sizes.
• Start with Seamless + moderate Darkening for editorial photo bands; switch to Boxed when you want a distinct card over the image.
• Use Content Origin to balance composition — place text on the side with more negative space in the photo.
• Add the button URL before expecting a visible CTA; without a link, no button renders on the front end.