Payment Fields
WittyForm integrates with Stripe to let you collect payments directly within your forms. No separate checkout page is needed. Respondents fill out the form and pay in a single flow.
Stripe Integration Setup
Before adding a payment field, connect your Stripe account to WittyForm:
- Go to Settings > Integrations > Stripe.
- Click Connect Stripe Account. You will be redirected to Stripe to authorize the connection.
- After authorization, you will be redirected back to WittyForm. Your Stripe account is now linked.
If you do not have a Stripe account yet, you can create one during the authorization flow. Stripe handles all payment processing, PCI compliance, and fund transfers to your bank account.
Adding a Payment Field
In the form builder, click + and select Payment from the Special category. The payment field is typically placed as the last field before the submit button, but you can position it anywhere.
The payment field renders a secure Stripe card input where respondents enter their card number, expiration date, and CVC. All card data is handled directly by Stripe and never touches WittyForm's servers.
Amount Configuration
Configure how WittyForm decides the Stripe charge amount in the field settings:
- Fixed Amount: Charge one exact amount in your selected currency.
- Pay What You Want: Let the respondent enter an amount inside your configured minimum and maximum range.
- From Distance: Charge the verified fare from a Distance field.
- Currency: Select from supported currencies such as USD, EUR, GBP, CAD, and AUD.
One-Time Payments
The respondent is charged once when they submit the form. This is the only payment mode the payment field supports. Use it for event tickets, product orders, consultation fees, and donations.
Testing Your Payment Flow
Before collecting real payments, test the flow with a Stripe account that is in test mode. While your connected Stripe account is in test mode, no real charges are made and you can use Stripe's test cards:
| Card Number | Result |
|---|---|
4242 4242 4242 4242 | Successful payment |
4000 0000 0000 0002 | Card declined |
4000 0000 0000 3220 | 3D Secure authentication required |
Use any future expiration date and any 3 digit CVC. Switch your Stripe account to live mode when you are ready to accept real payments.
Viewing Payments
All payments are visible in two places:
- WittyForm dashboard: The Responses tab shows payment status (paid, failed, refunded) alongside each submission. Click a response to view the full payment details including amount, currency, and Stripe payment ID.
- Stripe dashboard: All payments appear in your Stripe account with full details, receipts, and payout information.
Refunds
Issue refunds directly from the Stripe dashboard. WittyForm syncs the refund status automatically. The response in the WittyForm dashboard updates to show "Refunded" status. You can also issue partial refunds through Stripe.
Payment Webhooks
If you have configured a webhook URL for your form, payment events are included in the webhook payload:
{
"event": "form.submitted",
"data": {
"responseId": "resp_abc123",
"payment": {
"status": "succeeded",
"amount": 4900,
"currency": "usd",
"stripePaymentId": "pi_xyz789",
"receiptUrl": "https://pay.stripe.com/receipts/..."
},
"fields": { ... }
}
}Use this webhook data to trigger fulfillment in your backend, send custom receipts, or update your CRM.
Important: Payment fields require the Pro plan. WittyForm does not charge any additional transaction fees beyond Stripe's standard processing fees.