The checkout as the customer sees it

The checkout looks the same in every storefront.

Where: the storefront's /checkout. The settings: Storefronts › [storefront] › Checkout, see Checkout settings.

#The frame

The checkout shows your logo and accent colour. At the top it says "Secure checkout" (not on mobile). The footer has "Withdraw from purchase (Ångra köp)" when the storefront sells to consumers, the storefront's published legal pages, "Contact" and "Powered by BunStack".

#Step 1: contact and delivery

1. "Email". The checkout says "Order confirmation and tracking are sent here."
2. "Country" and "Postal code". The postal code is formatted as the customer types, for example 123 45. It gets a tick when it is valid.
3. "Shipping method". The methods show only once the postal code is complete. Each option shows carrier, delivery time and price. The checkout works out the estimated delivery in business days. The cheapest option is preselected: free first, and on equal prices the method higher in your list. The customer's own choice stays while it is offered.
4. Pickup point. The customer picks from a list near the postal code when the method needs it.
5. The customer presses "Continue to payment".

Store pickup shows among the shipping methods when the customer chooses the workspace's home country. See Store pickup.

The order summary is on the right, or at the top on mobile. It shows items, shipping and total and updates as the customer chooses.

Under the items the summary can show "Goes well with", products you suggest for the cart. "Add" puts the product in the cart, and the items, shipping and total update. The row shows in this step only. See Goes well with: suggestions in the cart.

#Discount code at checkout

The field is in the order summary. On mobile it is under the "Show order summary" bar, even when the summary is collapsed.

1. The customer types the code.
2. The customer presses "Apply" or Enter.

The discount shows as the line "Discount (CODE)" with the new total. Upper and lower case do not matter.

A code from the cart page or from a link with ?code= is already in the field. The tab keeps the code, not the address, so the code does not reach your statistics, see Tracking and Google Tag Manager.

A code can apply to full-price items only, see Discount codes:

• When the cart has only items on sale or with a promotional price, it says "The code does not apply to sale items or items with a promotional price."
• Under the code's minimum it says, for example, "The code applies to purchases of at least 500 kr." For such a code, "Sale items and items with a promotional price do not count." follows.
• When the code was taken off the full-price items only, "The discount does not apply to sale items or items with a promotional price." shows under the code.
• When the checkout finds this only as it creates the order, the same sentence is followed by "The discount code has been removed. Continue without it or enter another code."

While a code is being checked, the customer cannot continue. You create discount codes under Discount codes, see Discount codes.

#Step 2: payment

A card sums up "Contact", "Ships to" (country and postal code) and "Delivery". The "Change" button goes back to step 1.

Kustom's checkout window loads under the card. The customer fills in address and payment method there. The total is the same as in the summary. Before the purchase is approved, Kustom checks with BunStack that the stock is there and the amount is right.

The customer can change the discount code here too:

• A new code, or ✕ on the code, creates a new order at Kustom. The page reloads with the new amount.
• Meanwhile the checkout window is locked and "Change" is off. Over the window the text reads "Updating the payment window…".
• If the customer pressed buy in the checkout window in the last 15 minutes, nothing changes. The customer gets "You already pressed buy in the checkout window, so the code was not changed. Finish the payment there, or try again in 15 minutes if you cancelled it."
• If the update fails for another reason, the checkout shows "The payment window could not be updated. The code was not changed."

The replaced order does not count as abandoned, and nobody can pay it in another tab. The same applies when the customer presses "Change".

#Currency

The checkout locks the currency from the cart. If Kustom does not take the currency for the country, the checkout shows the button "Switch to [currency] and continue". It converts the cart to the same value in that currency.

#After payment

The customer lands on "Thank you for your order". The page confirms the order within a few seconds and then shows the order confirmation: order number, status, delivery, VAT per rate, product images, delivery address, right of withdrawal and the seller's details. The link in the email opens the same page without asking for the email address.

#When the checkout takes no payment

The checkout opens Kustom only when the integration is Connected. If Kustom rejects the credentials, the integration shows Error. The customer then sees "The checkout is not enabled for this shop yet." Correct the credentials or press Re-verify under Stack › Kustom. See Kustom.

A live storefront cannot switch to Native: the option is off on the Checkout tab. A save can still get through, for example from a tab opened before the storefront went live. BunStack refuses it with A live storefront cannot use native checkout: native takes no payment. Pause the storefront first. BunStack does not change a storefront that is already live on Native. It takes unpaid orders until you switch to Kustom or pause it.

#See also

• Emails to the customer
• Checkout settings
• Shipping methods, delivery countries and prices