Skip to main content

Image pair block

What is the Image pair block for?

Two photos, one composition. Image pair puts two pictures in one frame, one sliding over the other, with rounded corners and a soft shadow, like two prints lying on a table. It suits an About section, a workshop, a team or a finished project, where one picture is too little and a gallery is too much.

It works best next to text: put it in one column of a Columns block, and the heading, copy and buttons in the other.

Three layouts, the same two pictures

You can switch the layout at any time without uploading the pictures again.

Overlapping

The back picture sits top left and the front one slides over it at the bottom right, separated by a thin border. This is the default.

Tilted

The same two pictures, each turned a few degrees in opposite directions. A looser, more personal feel.

Steps

The two pictures stand side by side without overlapping, the second one starting a little lower.

Handmade terracotta pots, vases and bowls stacked together.
Hands shaping clay on a pottery wheel in a black-and-white close-up.
Overlapping, with the default settings
Handmade terracotta pots, vases and bowls stacked together.
Hands shaping clay on a pottery wheel in a black-and-white close-up.
Tilted, with a smaller front photo
Handmade terracotta pots, vases and bowls stacked together.
Hands shaping clay on a pottery wheel in a black-and-white close-up.
Steps, with photos the same size

What can you set on an Image pair?

Apart from the two pictures, every field is optional.

Two photos

A back photo and a front photo, each with its own ALT and TITLE text per language and a focal point, so the important part stays visible when cropped. One button swaps front and back.

Layout

Overlapping, Tilted or Steps. You can switch at any time.

Front photo size

Smaller, Slightly smaller or Same size as the back photo. A smaller front photo leaves more air in the composition.

Caption

An optional short line under the photos, for example “Ford Transit, 2024 · 11 weeks in the workshop”. Written separately for each language.

On phones

On narrow screens the composition scales down proportionally, the photos keep overlapping and nothing spills off the page.

Corners and shadow →

By default it follows the Images section of the Brand settings; you can override it under the block's Image frames setting.

Use two different pictures. An image pair works when the two photos complement each other: a wide shot and a close-up detail, a place and a person. Two nearly identical pictures on top of each other look like a mistake.

Gentle motion, for everyone. The pictures slide in once, gently, as the block scrolls into view. If a visitor's device asks for less motion, or their browser does not run JavaScript, the pictures are simply in place.

Image pair settings: layout, front photo size and caption, with each photo’s own ALT text below.

Two pictures, one story

A wide shot and a close-up say more than two similar pictures.

Pick two photos that complement each other and put them next to your text.