Communik.io : Site & App builder
communik.io
Sections · Hero

Hero with Image on the Right

Text on the left, a large visual on the right: the classic 50/50 hero that lets you pitch and show your product at the same time.

Use this block Add to an existing project

Free to start. No credit card.

Screenshot of Hero Image Right template

What this block contains

Hero Image Right is a section from the Hero category made of 1 heading, 1 text paragraph, 1 button, 1 image, 1 icon and 2 links. On desktop its content is laid out in 2 columns, stacked on mobile. Its copy ships in 3 languages (German, Spanish and French).

  • 1 heading
  • 1 text paragraph
  • 1 button
  • 1 image
  • 1 icon
  • 2 links
  • 2-column grid

Details

Category
Hero
Type
Section (full width)
Editing
Visual editor, no code
Keywords
imagesplitlandingproduct

Use it in three steps

  1. 1 Open your siteCreate a free Communik site, or open one you already have.
  2. 2 Insert itIt lands on your page with your fonts and brand colors applied.
  3. 3 Make it yoursEdit text, images and colors visually, then publish when ready.

More in Hero

See all Hero
Screenshot of Hero Simple Centered template

Hero Simple Centered

Centered hero with heading, subheading, and call-to-action button on a soft gradient

Hero

Screenshot of Hero Simple Left template

Hero Simple Left

Hero with content aligned left, optional badge, and two CTA buttons

Hero

Guide

Some products are better shown than described. The 50/50 hero gives equal weight to your message and your visual: headline and CTA on the left, a product screenshot, photo or illustration on the right. It is the default choice for apps, e-commerce and services with a strong visual identity.

In Communik, the image slot accepts any media from your library and is automatically optimized (responsive sizes, lazy-loading, WebP). On mobile the two columns stack gracefully, image below the message.

Combine it with testimonials and a closing CTA to finish the page.

Questions

What image size should I use?

Upload the largest version you have (ideally ≥1200px wide): Communik generates optimized responsive variants automatically, so pages stay fast.

Can the image go on the left instead?

Yes. Either pick the mirrored variant from the library or reorder the two columns directly in the editor.

What happens on mobile?

The columns stack vertically: message first, image below. Spacing and font sizes adapt automatically.

Keep exploring

About Sections Browse about sections templates Blog Sections Browse blog sections templates Call to action Sections Browse call to action sections templates Blog Module Complete blog feature with multiple design variants About Page Templates Full page layouts in the about category Templates for Education Templates designed for education businesses Instagram Templates Templates with Instagram integration support

Your next site starts here.
Everything here is one click away.

Every section, component, page and module in this library is ready inside the Communik editor, styled with your brand.

Use this block Browse the library

Free to start. No credit card.