← All case studies
PDPDynamicwebEXP-08Jul 2026

SA beauty retailer · Beauty & skincare retailBag context and a direct checkout after add-to-bag

The native 'item added' modal showed the item and nothing else. The variant adds the bag total, item count and a Checkout now button, driven by the site's own analytics event and cart feed.

ClientSA beauty retailer
PlatformDynamicweb
PagePDP
Measured onCheckout starts per add, Cart to checkout rate
Observation
  • Shoppers saw a confirmation with no sense of what was in the bag or how to get to checkout quickly.
  • The buy button lives in a fixed bar, so visibility checks could not gate clicks.
  • Sale prices are baked into line prices, so the cart's discount flag is only true for vouchers.
Hypothesis

Showing the added item with the bag total and a direct checkout call to action will increase checkout starts per add-to-bag.

What I built
  • Popup with item image, variant and price, bag item count and total, and a primary Checkout now button.
  • Trigger by wrapping the dataLayer push for the add-to-cart event, which only fires on a genuine successful add.
  • Bag summary read from the mini-cart JSON feed, with the just-added line matched by order line ID.
  • Native modal suppressed through CSS and by unchecking its trigger input.
The hard parts

Respecting server load

The client flagged a doubled cart call. The popup times out at four seconds and renders without the total, and a fallback reusing the native add-to-bag response was specified as the next step.

Verifying the discount path

Strikethrough pricing only appears with a cart-level voucher, so that branch was verified with a stubbed cart rather than left untested.

Outcome

Measured on checkout starts per add, cart to checkout rate. Test results belong to the client and are shared in conversation, with their permission, rather than published here.

More experiments

View all →