GWP × Acer · concept mockup

Free gifts at the basket,
themed to the Acer Store.

A third-party-funded gift-with-purchase offer rendered inside the Acer Store's own basket page. The panel is built from Acer's live design tokens — Noto Sans, the green pill CTA, the #222 headings, the 1px grey card rules — so it reads as part of the page rather than an ad dropped on top of it.

Basket page 3 funded offers £0 cost to Acer Commission per claim No checkout changes

Surface 01

Basket page

The gift panel sits directly beneath the products table, in the wide column — full visibility without touching the discount box, the basket total or the route to checkout. Toggle to see the basket before and after a shopper picks their gifts.

store.acer.com/en-gb/checkout/cart/
UP TO £500 OFFSHOP NOW
1

Shopping Basket

Your Products
Price
Quantity
Subtotal (Incl. VAT)
Acer Swift Go 16 AI OLED Ultra-thin Laptop
£1,299.99
£1,299.99
OUR CUSTOMERS RATE US ★★★★★ 4.63 Excellent 5,750 reviews e

Your free gifts

Pick up to 3 · nothing to pay
FreeEnjoy 90 Days of Discounts FREE!
from tastecard · 90-day membership included
FreeClaim a FREE Gin/Rum Taster Box!
from The Curious Drinker · 18+ only
FreeFREE Summer Skincare Kit (Worth £36)!
from grüum
Gifts are funded by the brands offering them — they cost Acer nothing and don't change your order or your delivery. Claim links arrive with your Acer order confirmation email.
Continue Shopping

What changes when a gift is picked: the row flips to an “Added” state and the Basket Total gains a Free gifts line at £0.00, sitting alongside Acer's own Discount row in the same savings green — added value without altering the total or the checkout path. Placement, offer count and copy are configured per retailer; nothing here is hard-coded.

How it's built

Themed from Acer's own tokens

None of this is a bespoke build. Every value below was read off the live basket page at store.acer.com and dropped into the widget's theme config — the same way any retailer is styled.

Tokens in use
#80c343Gift CTA — the same green
as Proceed to Checkout
#222222Headings + selected outline
#474747Body and secondary text
#128228“Free” chip — matches their
own Discount row
#e0e0e01px card rules and dividers
Noto Sans 600Pill buttons at 500px radius
Reusable for any prospect
  1. Capture the tokens. Open the retailer's basket page and read the CTA colour, text colours, font and corner radius straight off the live DOM.
  2. Paste them in. All of them live in one :root block at the top of this file.
  3. Swap the contents. Replace the line item and the three offers with ones that suit their customer.
  4. Publish. One command puts it on a public link you can send — the recipient needs no login.

Same process produced the Pro Breeze and Studio mockups, so anyone on the team can turn a prospect round without design work.