Styling
The Styling tab lets you set the colours, border radius, and other visual properties that all web components use by default.Brand Colours
Your button colours and corner radius also brand the payment page, which isn’t part of your storefront. Backgrounds and text colours there are left as they are.
Text Colours
Backgrounds & Borders
Status Colours
Each status colour has a corresponding background colour for message containers.
Badge Colours
Account Accents
These accent colours are used as highlights on the customer account page sections:Border Radius
Control how rounded corners appear across your components:- Buttons and inputs - Choose from Sharp, XS, SM, MD, LG, XL, 2XL, or Full (pill shape)
- Cards and containers - Choose from Sharp, SM, MD, LG, XL, 2XL, 3XL, or Full
- Modals and popups - The radius used for dialogs, drawers and the upsell option chooser
- Product image corners - Set a separate radius for product images
Add-to-Cart Notification
The confirmation shown when a customer adds something to their cart without being redirected. See After adding to cart.- Style - Dark or Light. Two fixed looks, so it stays readable over whatever your page puts behind it.
- Position - Bottom centre, bottom left, bottom right, top centre, top left or top right
Checkout Background
Set separate background colours for the two panels in the checkout layout:- Order summary (left) - The background behind the order summary sidebar
- Checkout form (right) - The background behind the customer details and payment form
Product
The Product tab controls how individual products are displayed in both mini and full views.Quick Attributes
Display key product attributes (e.g. Size, Colour, Material) directly on the product card without customers needing to open the full product page.- Toggle quick attributes on or off
- Choose which attributes to display
- Drag to reorder the attributes
Accordion Sections
Configure which content sections appear on the full product page and in what order. Drag sections to reorder them. Available section types:
Each section can be set to open or collapsed by default.
Product images
Control how product images are displayed on the full product page:- Thumbnail position - Show thumbnails to the side of the main image or along the bottom
- Zoom / lightbox - Toggle an image zoom and lightbox overlay so customers can view images full-screen
Event display
For event products, choose how upcoming occurrences are presented:- Default view - Show occurrences as a list or a calendar
- Upcoming occurrences - Set how many upcoming occurrences to show (1–60)
Product behaviour
Text labels such as Add to Cart, Sale badge and Subscriber badge now live on the Labels tab.
Collection
The Collection tab controls how product grids appear.Background
Set a background colour for collection pages.Product Cards
Collection Behaviour
Text labels such as Add to Cart, badges and the “More” link text now live on the Labels tab.
Labels
The Labels tab consolidates the storefront text labels used across your components in one place. These previously lived under the Product and Collection tabs.Subscription frequency wording
Choose how subscription frequencies are described:- Worded - e.g. “quarterly”
- Interval - e.g. “every 3 months”
Cart
The Cart tab controls the shopping cart component.Container Styling
Add a background colour or border to the cart component to help it stand out on your page.- Background - Toggle on and select a colour
- Border - Toggle on and select a border colour
Free Shipping Notification
Show a message in the cart telling customers how much more they need to spend to qualify for free shipping.- Enabled - Toggle the notification on or off
- Message - Customise the message text. Use
{amount}as a placeholder for the remaining amount (e.g. “Spend more for free shipping!”) - Display Threshold - Set a minimum cart value per market/currency. The notification only appears when the cart value is below this threshold.
Related Products
Display product recommendations in the cart to encourage additional purchases.- Enabled - Toggle related products on or off
- Section Title - Customise the heading (e.g. “You might also like”)
- Number of Products - Choose how many products to display (1–12)
Checkout
The Checkout tab controls the checkout experience.Background Colours
The checkout uses a split-panel layout. You can set separate background colours for each side:- Order summary (left) - Customise the background behind the order review
- Checkout form (right) - Customise the background behind the payment form
Logo
Control how your logo appears at the top of the checkout:- Position - Left, Centre, or Right
- Height - Small, Medium, Large, or Extra Large
Phone Field
- Require phone number - When enabled, customers must enter a phone number to complete checkout
Newsletter
Configure the newsletter sign-up checkbox shown to guests during checkout.- Message - The wording shown next to the checkbox. Leave blank to use “Subscribe to our newsletter”.
- Pre-tick the checkbox - When enabled, the checkbox starts ticked. Customers can still untick it before continuing.
Marzipan records the wording each customer was actually shown, and whether the box was pre-ticked, against their cart and order. Editing the wording later never rewrites consent already given.
Create an Account
Guests are always offered a password field on the order confirmation, so the order they just placed becomes an account. Only the wording is configurable. Anyone who already has a password never sees it.- Label - The only line of copy in the block. Leave blank to use “Enter a password to create an account”.
- Button - Leave blank to use “Create account”.
- Confirmation heading - Shown in place of the form once the account is made.
- Confirmation message - Use
{email}where the customer’s address should appear.
Ask “How did you hear about us?”
Asks the referral question again on the confirmation page when the customer skipped it at checkout. Asking there costs no conversion, so it usually fills in a good share of the gaps. Needs the referral sources below to be configured, and it never appears on an order that already has an answer.Reward Points Banner
The band on the order confirmation showing what the order earned. It only appears when rewards are switched on.- Banner colour
- Text colour
- Icon colour
- Corners
Referral Sources
Ask customers how they heard about you during checkout. This data feeds into your Attribution insights.- Enable dropdown - Show or hide the “How did you hear about us?” question
- Allow “Other” option - Let customers type a free-text answer
- Source options - Add, remove, and reorder options. Each source can include:
- A display label
- An auto-tag (automatically applied to the customer record)
- An optional follow-up question (free text or dropdown) for more detail
Account
The Account tab controls the customer account component.Subscription Upsell
Display a product grid within the customer account encouraging customers to start a subscription.- Enable - Toggle the upsell section on or off
- Product Collection - Choose which collection to display products from
- Heading - Customise the section heading
- Message - Add a message encouraging customers to subscribe
- Grid Columns - Set the number of columns for mobile, tablet, and desktop views