Skip to main content

How to add a payment page

1

Select a payment type

Click + Add page and choose Payment.
Choose a page type menu above the Add page button, with Payment in the list
Select between the following types:
  • One-time - for single, non-recurring transactions
  • Subscription - for recurring transactions usually with a fixed price
  • Pay what you want - leave the amount up to the customer
You can add a payment page anywhere in your form. Payment pages work on every Fillout plan, and Fillout doesn’t charge a fee for them. Stripe’s usual fees, like transaction costs, still apply.
2

Enter details

Add the details of your payment page and click Connect to Stripe. To set what you’re selling, click the product under Product to open Edit product. From here you can choose the currency, and make the price and product name dynamic by clicking the plus icon or typing @ to reference a specific field.
Edit product dialog with the Product name and Price fields referencing form answers
In this example, the product name and price will change per customer depending on their order.The default payment method in new forms is through a card. You can give more options to your customers by adding more Payment methods through the left-hand panel.
3

Publish and share

Click Preview to try out your form. Payments will only be collected when you Publish the form and send its link.

Test your live form without being charged

Payment pages don’t work with Stripe sandboxes or test mode, so you can’t connect a test Stripe account to try them. Instead, test on your live form with a 100% off discount code:
  1. In Stripe, create a 100% off coupon with a promotion code.
  2. Turn on Allow discount codes on the payment page and publish the form.
  3. Open the live form and enter the code at checkout.
  4. When you’re done testing, turn Allow discount codes off again and publish the form.
The submission is recorded with nothing charged. See Choose which discount codes a form accepts for how Fillout checks codes.

Offer several subscription tiers

A subscription payment page uses one Stripe price. To offer several tiers, add a payment page for each tier and use page logic earlier in the form to send respondents to the right one.

Add VAT to prices

Fillout doesn’t add VAT to prices automatically, even if tax is turned on in your Stripe account. Use calculations to work out the price with tax included, then use that calculation as the price on the payment page.

Use a different Stripe account for each form

Each payment page has its own Stripe connection. Payments go to the Stripe account connected on that page, so separate forms can collect payments into separate Stripe accounts, even when their responses are saved to the same database. For example, each branch of a business can have its own form that pays into that branch’s Stripe account. To see which account a payment page uses, select the page and check Stripe connection in the left-hand panel. To switch to another Stripe account:
  1. Under Stripe connection, click the three-dot menu next to the connected account and choose Disconnect.
  2. The payment page now shows the Stripe accounts already connected to your organization. Choose the other account and click Continue. To use an account that isn’t in the list, choose Connect new account in the list and click Connect to Stripe.
  3. Click Publish so the live form uses the new account.
Stripe connection in the left-hand panel with the three-dot menu open and the Disconnect option
Payment page in the editor saying You've already connected to Stripe, with a list to choose a connected Stripe account and a Continue button
To check it worked, open the payment page again and confirm the account name under Stripe connection.

Supported payment methods

The payment page accepts these payment methods:
  • Card
  • Link, Stripe’s saved payment details
  • US Bank Account
  • Affirm, which lets customers pay in installments. Affirm only works for one-time payments, so it isn’t available on subscriptions
Choose the ones you want under Payment methods in the left-hand panel. You can remove Card, but at least one method has to be selected. If none is, the page uses card. Other methods you turn on in your Stripe account, such as Apple Pay, Google Pay or Klarna, don’t show on the payment page and can’t be added to it.

Customize payment settings

The left-hand panel groups the payment page settings into sections. Under Payment:
  • Allow discount codes - let respondents enter a Stripe promotion code at checkout. Manage discount codes in Stripe opens the coupons page in your Stripe dashboard, where you create the codes. See Choose which discount codes a form accepts.
  • Collect email - create a customer in your Stripe account for each payment.
  • Pre-fill fields - fill in the customer’s email, name, phone and discount code from other fields or URL parameters.
  • Payment methods - choose which of Card, Link, US Bank Account and Affirm the page accepts. See Supported payment methods.
  • Stripe payment description - the description that shows on the payment in Stripe. For one-time payments, it’s also the item text on the Stripe receipt. Click the plus icon or type @ to add an answer from the form, like the course someone picked. If you leave it empty, Stripe shows Form “your form name” payment.
Payment settings with Allow discount codes on, the Manage discount codes in Stripe link, and Pre-fill fields on with the Discount code option
Under Appearance:
  • Button text - change the text on the payment button.
  • Show testimonial - add a customer quote to the checkout to help more people complete it.
  • Show disclaimer - add terms about returns, shipping or anything else, to reduce disputes.
Appearance settings with Button text and the Show testimonial and Show disclaimer switches
Under After payment:
  • Send receipt - send a Stripe receipt after the purchase. It needs Collect email turned on.
  • Thank you page or redirect - this is set on the ending page. Click To change, go to ending page to open it.
After payment settings with the Send receipt switch and the To change, go to ending page button
Here’s a sample receipt. Receipts aren’t sent from Preview. The Product name you set in Edit product shows on the payment page in your form, not on the Stripe receipt. To change what the receipt says, set Stripe payment description under Payment.
Sample Stripe receipt email with the amount paid, date, payment method and summary

Choose which discount codes a form accepts

When Allow discount codes is on, the payment page accepts any active promotion code from the Stripe account connected to it. Fillout checks the code respondents enter against Stripe, but there’s no setting to link specific codes to a specific form. If several forms use the same Stripe account, a code you create for one form also works on the others. For one-time payments, Fillout works out the discount itself, so product limits you set on a coupon in Stripe don’t stop the code from applying. Codes used on one-time payments also don’t appear in the coupon’s redemptions in Stripe, but each Stripe payment shows the amount paid after the discount. For subscriptions, Fillout adds the code to the subscription in Stripe, so the coupon’s own settings in Stripe apply, and the redemption shows on the coupon. To apply a code automatically, open Pre-fill fields on the left-hand panel and choose a URL parameter or form field for Discount code. This option shows when Allow discount codes is on.

Limit a discount code to one form

To accept a code on one form only, check the code in the form instead of in Stripe:
  1. Turn off Allow discount codes on the payment page, so respondents can’t enter other Stripe codes at checkout.
  2. Add a Short answer field before the payment page that asks for the discount code.
  3. Add a second payment page with the discounted price.
  4. Use page logic to send respondents who enter an allowed code to the discounted payment page, and everyone else to the regular one.
The form handles this discount, not Stripe, so Stripe coupon settings such as an expiry date or a maximum number of uses don’t apply. Try both paths in Preview before you publish.

When a submission is recorded

A form with a payment page can’t move past the payment until Stripe responds. If a respondent abandons the payment or it’s declined, the response stays in progress and doesn’t trigger webhooks, Zapier, or other integrations. Some submissions come through without a completed charge:
  • Skipping the payment page - if page logic lets a respondent skip the payment page, that path submits without a payment. Keep the payment page on every path to the ending.
  • $0 checkouts - one-time payments that total 0, for example with a 100% discount code, submit with nothing charged.
  • Free trials - subscriptions with a free trial submit before anything is charged.
  • US bank account payments - these submit while the payment is still processing, before the money arrives. Fillout doesn’t update the payment status afterwards, so a submission stays even if the bank payment fails later.

If the form can’t move past the payment page

A payment page needs somewhere to go next: another page or an ending. You can change where it leads with page logic. If the payment page doesn’t lead anywhere, respondents who click Pay see This form can’t be completed right now. You haven’t been charged. Please contact the form owner., and nothing is charged. Add a page or an ending after the payment page, then publish the form. If a payment goes through but the form can’t move on, for example because it was closed or reached its submission limit, respondents see Payment complete and a Next button instead of the Pay button, so they can’t pay twice. The message says Your form hasn’t been submitted yet. Press Next to try again. The submission is only recorded once Next works.

Payment details in each submission

The payment field in each submission includes the payment status, total amount, currency, any discount code used, and the Stripe payment ID. The status is one of these: To act only on paid orders, for example in a Zapier filter, check that the status is exactly succeeded. Don’t use “contains”, or succeeded_free orders will match too. An exact match also leaves out US bank account payments, even after they clear, so check those in Stripe using the payment ID.

Pass form data to Stripe

Form fields, like a hidden field filled from a URL parameter, can’t be added to the Stripe payment’s metadata. Each submission includes both the field value and the Stripe payment ID, so you can match them in your own records. To store the value in Stripe too, add a Zapier step that updates the PaymentIntent metadata using the payment ID.

Reference the payment intent ID in integrations

You can save the Stripe payment ID to the integration of your choice by referencing it. Click Integrate at the top and choose a platform. Under Mappings, click + Add new and look for Stripe Payment ID.
Mappings section of an integration with the value picker open, listing Product, Price, Currency, Amount paid and Stripe Payment Id
Stripe payment IDs look like “pi_3MKECGFiethEjGwr1TWmQ0rN”. Use them to match a form submission to its payment in Stripe.

Dynamic payment page

Auto-update product and price by order.

Calculations

Calculate prices, compute scores, and more.

Hide fields

Hide or show fields based on answers, URL parameters or data.