Payment Timing & Stripe Terminal
Choose when guests pay, design the Payment page, and take card payments with a Stripe card reader.
Choose when guests pay (before the editor or when the order is placed), design the Payment page, and take card payments with a Stripe Terminal card reader, with a QR code as a backup. Includes Stripe Terminal setup and refunds.
Overview
In the Payments section on the Advanced tab of your event, you decide when guests pay and how. Guests can pay before they design, or when they place their order, and they can pay with a QR code on their phone or with a card on a Stripe card reader (Stripe Terminal). First add your Stripe key and choose a payment configuration, then follow this page.
Screenshot placeholder — The Payments section in the event settings
When should guests pay?
Use When to request payment to choose where payment happens in the guest journey:
On order placement (default)
Guests design first. They pay in the editor when they place their order. This is how payments worked in the earlier docs.
After landing page
Guests pay right after the landing page, before anything else. Available for events without child events.
After child event selection
Guests pay once they have chosen a child event. Available for events with child events.
After survey / before editor
Guests answer the survey, then pay, then open the editor.
Same as parent event
For child events only. The child event uses the same timing as its parent.
If guests pay before the editor, a Payment page is shown. If you choose the survey option, guests who cancel on the Payment page start again from the beginning and must redo the survey.
The Payment page
The Payment page appears for every timing option except On order placement. Guests see a title, a message, the amount, and a QR code to scan and pay on their phone. The page moves on by itself as soon as the payment is received. There is also a Pay on this device button, and a Cancel and start over button.
Wording
Edit the Title (default "Pay to continue"), Message, Button text, Waiting text, Payment received text, and Cancel button text. You can also hide the Pay on this device button.
Colors
Set the Page background, Card, Text, Button, and Button text colors. Anything you leave empty copies the look of your landing page.
Background and logo
Upload a Background image and a Logo, and choose the Background Fill Style (Fill, Contain, Stretch, Repeat, or Original size). Empty fields use your landing page image and logo.
Screenshot placeholder — The Payment page on a phone-sized screen
Advanced layout for the Payment page
Like your other workflow pages, the Payment page can use the Advanced Layout Builder. In the Payments section, open the Advanced layout panel and click Open layout editor.
Payment elements
Add the Payment (amount, QR code, status) block, the Pay on this device button, and the Cancel and start over button, plus the usual subtitle, text, image, card, video, and widget elements.
Payment area style
Style the product name, price, waiting text, and payment received text. You can also change the spinner, and the QR code size, colors, padding, corners, border, and shadow.
The same layout is used for the card reader screen, so your design stays consistent.
Set up Stripe Terminal
Stripe Terminal lets guests tap, insert, or swipe a card on a physical card reader. You set it up once for your Stripe account.
- 1
Add your Stripe keys
On the Events page, click Payment Settings, then Add Payment Configuration. Enter a Payment Name, your publishable key, and your secret key, then click Save Configuration.
- 2
Open the Stripe Terminal panel
On the saved configuration, click Stripe Terminal.
- 3
Add your location
Create a Location in your Stripe Dashboard (Terminal, then Locations). Paste its ID in Stripe location ID and click Save.
- 4
Register your reader
Type the Registration code shown on the reader and a label such as "Front desk", then click Register reader.
- 5
Test it
Your reader appears under Registered readers with an Online or Offline status. Click Test connection to check it.
Supported readers
Wi-Fi readers T600, S710, S700, and BBPOS WisePOS E.
Web, apps, and desktop
On the web you register a reader with its code. In the Android and iOS apps you can also Find readers on this network and Pair WisePad 3 over Bluetooth. A Card reader button in the app toolbar connects a reader to that device.
Screenshot placeholder — The Stripe Terminal panel with a registered reader
Use the card reader in an event
- 1
Turn it on
In the event's Payments section, switch on Enable Stripe Terminal payment.
- 2
Choose the reader
Pick it from the Card reader list. Click Refresh if you just added it.
- 3
Edit the Card reader screen
Change the Title (default "Pay by card"), Instructions, waiting, payment received and failure texts, the QR button label, the Accent colour, Icon colour, and Icon style (Contactless, Card, or Phone).
The terminal only accepts the currency of your Stripe account's country. For example, if your Stripe account is in the UK, set the Currency in the Payment Configuration to GBP. QR code payments are not affected.
Guests can always tap Pay by QR code instead to switch to the QR code. If no reader is connected, guests simply pay with the QR code.
What guests see with a card reader
Guests see the Card reader screen with an icon and the instructions. It then shows a waiting message and a success message. If the payment fails they can tap Try again, or switch to the QR code. Receipts go to the email address Stripe has for the payment. A card reader may not collect an email, so the customer receipt can be skipped.
Refunds
Paid orders can be refunded from the order page. See Refunding a design order.
No internet at the venue?
The card reader can keep taking payments offline in the iPhone/iPad and Android apps. See Offline Card Payments. To give money back, see Refunds.