What shoppers see: cart, favorites and checkout

A TeleportHQ store gives your shoppers a full buying path on your published site: a products list, a page for each product, a cart, a checkout page and an order page. At checkout they enter their details, choose delivery or store pickup, pick a shipping method if you charge by country, can apply a discount code or a gift card, and pay online or on delivery. You control each part from E-Commerce Setup, and you can edit every store page in the editor like any other page.

The shopper's path#

When you turn on your TeleportHQ store, TeleportHQ creates its pages in an e-commerce folder in your Pages panel:

1. Products list (/products): shoppers browse, search and filter your products. Each product card has Add to Cart, or Out of stock when it can't be bought.
2. Product page (/products/your-product): photos, price, variants like size or color, related products and, if you turn them on, reviews.
3. Mini cart: a drawer titled Your Cart that opens from the cart button, with View Cart and Checkout.
4. Cart page (/cart): items, Subtotal, Shipping (or FREE), any discount, Total and Go to checkout. With a free-delivery amount, it also says how much more the shopper needs to spend. With shipping zones on, the cart estimates shipping for your store's own country, or shows Calculated at checkout when it can't.
5. Checkout (/checkout): the order form, described below.
6. Order page and My Orders (/orders): signed-in shoppers see their orders, shipments and invoices.

What happens at checkout#

The TeleportHQ checkout page has these parts:

• Billing Details: name, email, phone, company, address and Country. Ship To Different Address adds a separate shipping address. Signed-in shoppers find their saved account details already filled in.
• Choose Delivery Method: Delivery or Store Pickup, depending on what you turned on. Pickup shoppers choose a store under Select Pickup Location. If you allow it, delivery shoppers can add Delivery Notes.
• Shipping Method: only with shipping zones. Once the shopper enters an address, the shipping options for that country show, with the cheapest one selected. See How to charge different shipping prices by country.
• Order Summary: the products, then:
  • Choose your discount, when two discounts can't be combined: the shopper picks one, and the one that saves the most is selected first.
  • Have a voucher?, a field for discount codes, when vouchers are on.
  • Have a gift card?, when gift cards are on. See How to sell gift cards and accept them at checkout.
  • Sub Total, Discount, Shipping or Store Pickup, and Grand Total.
• Select Payment Method: one option for each payment provider you connected (Stripe, PayPal, Mollie, Razorpay, Square, Paddle or CoinGate), plus Pay on Delivery / Pickup when cash on delivery is on.
• A terms and conditions checkbox, then the button that places the order (an older checkout shows the button above the checkbox):
  • Pay Now when the shopper pays online (Subscribe now if the cart holds a subscription);
  • Finalize Order when the shopper chose Pay on Delivery / Pickup;
  • Place Order, in a Complete Your Order box, when your store has no payment provider connected: "Payment will be collected upon delivery or pickup."

Shoppers can pick the payment method, the pickup store, the shipping method and the discount from the keyboard: Tab reaches the chosen option, and the arrow keys change it. Screen readers name each group by its heading. The Delivery / Store Pickup choice can't be reached by keyboard yet.

After the shopper places the order:

• Online payment: the shopper goes to the payment provider's secure page (for Stripe, cards plus wallets like Apple Pay or Google Pay), then back to their order page. The order turns Paid when the provider tells your site. See How to set up the payment webhook. On an active trial or a paid plan, an online order still unpaid 60 minutes after the shopper was sent to pay is cancelled, and its items go back on sale. See How to accept payments with Stripe or PayPal.
• Pay on delivery or pickup: the order is placed right away with "Your order has been placed successfully! Payment is due upon delivery." You mark it paid later. See How to mark an order as paid.

Which emails the shopper gets afterwards depends on your store's email settings. See Which emails does the store send?.

Store settings that change checkout#

All TeleportHQ store settings are in one panel:

1. In the left sidebar, click E-commerce (the card icon). If you don't see it, click Plugins, then E-commerce, then Open next to E-commerce panel.
2. At the top right of the E-Commerce panel, click the gear (E-Commerce Settings).

The E-Commerce Setup panel opens next to it. Some settings show a link next to their name while they're on, like Delivery Settings. Click it to open that setting's own panel.

The same panel also holds Products Listing, Product pages, Google Shopping and the Digital products settings, which change your product pages rather than checkout.

Turn cash on delivery or guest checkout on or off#

1. In the E-Commerce Setup panel, find Cash on Delivery ("Allow customers to pay when they receive their order.") or Guest Checkout ("Allow customers to place orders without creating an account.").
2. Click the switch.
3. Publish your site so the change reaches your live checkout.

When Guest Checkout is off, shoppers who aren't signed in are sent to your sign-in page when they add a product to the cart. With shipping zones, you can also refuse cash on delivery for one zone only.

The shopper's account page#

When your TeleportHQ store has user sign-in, signed-in shoppers get a My account page with these tabs:

• Account: their name, phone, company, address and profile photo.
• Orders: everything they ordered.
• Bookings: shown when your project also takes bookings.
• Subscriptions: shown once you sell subscriptions. See How to sell subscriptions.
• Gift cards: shown once Gift Cards is on.

The line under the My account heading names what the tabs hold, for example "Manage your details, your orders and your bookings."

Checkout fills Billing Details from the Account tab. When the shopper places an order, details missing from their account are saved from the checkout form. Details already on the account are never overwritten this way, and an address is only saved when the account has none. See How to show the signed-in user's name, photo and details.

Favorites#

When Allow Favourites is on, signed-in shoppers see a heart on products and a My Favourites page. See How to turn on product reviews and favorites.

Preview the cart while you design#

Checkout and payments don't run on the editor canvas. To see your TeleportHQ cart and checkout pages with products in them:

1. Open the cart page, the checkout page or the mini cart on the canvas.
2. Above the canvas, click Cart. The Cart Emulator opens.
3. Under Add Products, click Add next to a few products.

The canvas now shows the cart with its subtotal, shipping and automatic discounts. With shipping zones on, choose a country in Ship to to see that country's shipping and tax. With vouchers on, the checkout page shows a Test a voucher button under the voucher field, to preview a code. Nothing is saved to your store.

To test a real order, publish and follow How to test payments before going live.

Good to know#

• Publish after changing a switch. Store switches, delivery settings and payment providers reach your live site after you publish. Discount codes, automatic discounts, shipping zones, tax rates and store locations are saved in your store's database, so later changes to them reach the live store without publishing again.
• Delivery or pickup must be on. If you turn one off while the other is off, TeleportHQ turns the other back on.
• Prices with tax. If your store's default tax is Added on top with a rate above 0, the cart and checkout add that tax to prices. With tax rates per country, the tax follows the address entered at checkout. See How to set up invoices and VAT and Shipping zones.
• Special carts. A cart with only digital products or gift cards has nothing to ship, so checkout asks for no delivery method and charges no delivery fee. A cart with a subscription is paid online: it offers no store pickup, no cash on delivery and no voucher field.
• Older stores. If your checkout page was built before vouchers, shipping zones, automatic discounts or gift cards existed, their panels show a Recreate checkout page button. It replaces the checkout page with a new one, so changes you made to the old page are lost. Publish afterwards.