Image With Text

The Image With Text block combines a media image with descriptive content (heading, text, and button) in a flexible layout. Ideal for feature highlights, promotional banners, or storytelling sections.

Settings

• Enable full width: Expand the block to 100% of the viewport width.
• Block class: Custom CSS class for spacing or layout overrides.
• Background: Set a solid or gradient background color.
• Or, use image: Apply a background image using a preset from Theme Settings → Style scheme settings → Background Image Schema.

  All four settings above follow: Blocks → Overview → General Settings

Layout

• Layout: Choose content arrangement:
  • Text left: Text on the left, image on the right
  • Text right: Text on the right, image on the left
  • Text overlay image: Text floats directly over the image
• Text width: Width of the text column as a percentage of the container (e.g., 45%).
• Overlay opacity: Background opacity (0–100%) behind text when Layout = Text overlay image.

Child Blocks

Image

Main visual asset. Settings follow Blocks → Basic Block → Image.

Heading

Section title. Settings follow Blocks → Basic Block → Heading.

Text

Supporting description or call-to-action. Settings follow Blocks → Basic Block → Text.

Button

Action link (e.g., “Shop Now”, “Learn More”). Settings follow Blocks → Basic Block → Button.