Skip to main content

​
Code

​
Props

Props should be passed as attributes to the component element.
​
string
The path to the checkout page.Defaults to /checkout
​
string
The message to display when the cart is empty.Defaults to You have nothing in your cart.
​
string
The path to the shop page.Defaults to /shop

​
Features

​
Free Shipping Notification

The cart can display a progress message showing how much more a customer needs to spend to qualify for free shipping. This is configured in your web component settings and includes a customisable message with an {amount} placeholder and per-market display thresholds. Display product recommendations within the cart to encourage additional purchases. Configure the section title, number of products, and toggle visibility from your web component settings.

​
Container Styling

The cart component supports optional background colour and border styling, configurable from your web component settings.

​
Styling

The following parts are available to style the cart component:
​
The containing <div> around the cart.
​
The checkout button element.
​
The <img> element that contains the product image.
​
The containing <div> around the product image.
​
The “continue shopping” link element.
​
The <div> that contains the empty cart message.
​
The pulsating loading elements that are shown when the cart is loading.