Opens in a new tab
Log inStart free

CTA · Split photo

A CTA section for Bricks Builder in a rounded panel split in two: a photo with a small tag on one side, and a title, a short text and two buttons on the other. Built on the FBK Button and FBK Intro, it is a clean way to pair a visual with a call to action.

FreeDark mode ready

Copying for Fancy Framework · Desktop first

Needs a framework. Get Fancy Framework (free)

Free with a free account.

Preview

Preview of the split photo template: a CTA section for Bricks Builder in a rounded panel split in two

Template details

What’s inside

The components it’s built from. They come with the template when you paste it, and you edit them from the Bricks panel.

  • FBK Button

    A link styled as a button, with style, size and width.

  • FBK Intro

    Eyebrow, title, lead and an actions slot for buttons.

Adjust it

Change these variables in Bricks to tune it; everything else follows your framework.

On the element CTA panel, class fbk-ctasplit

Smallest height of the photo side

--fbk-t-photo-min
24em

Shape of the photo on phones (stacked above the text)

--fbk-t-photo-ratio
16 / 10

Photo zoom on hover: a photo's pace, 1.5 x the library's hover time

--fbk-t-zoom-time
calc(var(--fbk-hover) * 1.5)

More like this

See all CTA templates