Split Offers
A promo split into two panels, each holding a separate offer and button. Lets shoppers pick between two competing deals within one store section.
A promo split into two panels, each holding a separate offer and button. Lets shoppers pick between two competing deals within one store section.
Search blocks by description or jump to a page.
Split Offers is a two-column layout that pairs a content column with a full-height image. The left column opens with a headline and a short supporting paragraph, then stacks two offer cards beneath them. Each card carries a tier label, a discount statement, and a short checklist of perks marked with check icons. A primary button and a ghost text link sit below the cards as the main calls to action. The right column is an image that bleeds to the container edge on large screens, filling the remaining width alongside the content.
The two offer cards, the headline, the body copy, and the image are all independent. You can rewrite the tier names and perk lists, swap in a different photo, or remove one of the cards to present a single offer with more breathing room. The button labels and link text are plain copy with no dynamic logic behind them.
Reach for this block when you want to surface two membership tiers or subscription plans side by side without sending shoppers to a separate pricing page. It works well mid-page on a store homepage or a brand landing page, where a visitor has already seen your products and is ready to learn what loyalty membership offers them. Compared to a single centered promo it lets shoppers weigh two options at a glance rather than committing to one message.
A natural flow around it on an Ecommerce page:
Before
After
This block works best when you have two distinct offers that compete for the same shopper's attention. A few ways to fill the frame:
Tip: keep each perk list to two or three items so the cards stay at the same height and the layout reads as a true side-by-side choice.