Custom fields in Stripe Checkout

In this episode, you'll learn how to integrate with Stripe Checkout so that customers can enter custom data with their payment details. You can add drop-down select boxes, text, and numeric inputs. You can also use custom fields with Stripe's no-code Payment Links option.
Presenter
CJ Avilla - Developer Advocate at Stripe - / cjav_dev
Table of contents
00:00 Introduction
01:22 Creating products and prices in the Dashboard
01:45 Server code
02:34 Adding a custom text field
04:12 Making a custom field optional vs required
05:31 Adding a custom dropdown field
07:36 Adding a custom numeric field
09:28 No code: adding a custom field to a Payment Link
10:18 No code: adding custom fields to a pricing table
10:48 Conclusion
Resources
Documentation stripe.com/docs/payments/chec...
Support
If you have a question, please feel free to reach out to our support team on Discord at stripe.com/go/developer-chat
Updates
Sign up to stay updated with developer news: go.stripe.global/dev-digest
Feedback
If you have any feedback about this or other episodes, let us know: forms.gle/VjNqzRhotM2snYo88
#stripe #payments #checkout #paymentlinks

[@Sammysapphira]

Just what i needed thank you

[@shailendra-zealous]

Thanks
Hope there will be more custom input types in the future

[@jsteele-stripe]

Interesting. What other kind of field types would you like to see supported?

[@shailendra-zealous]

​@@jsteele-stripe Currently it supports text, numeric and dropdown but I would like to have checkbox input field and currently it allows maximum 3 fields but more than 3 custom fields should be allowed

[@jsteele-stripe]

@@shailendra-zealous Got it thanks! What's the use case for more than 3 fields? We've no plans to increase the limit beyond that.

[@shailendra-zealous]

@@jsteele-stripe Currently don't know the use case, but in the future, for some projects, if client wants to collect information then we can handle the situation
I haven't used custom fields but if we can get custom fields' value in webhook then we can perform operations based on that data

[@jsteele-stripe]

@@shailendra-zealous Yep, the `checkout.session.completed` webhook event will contain the custom fields and values entered by customers on the payment page.

[@SellyS.]

Hi there, I'm trying to retrieve that custom data setup via the payment link using a webhook. I've tried using the checkout session completed event but am only getting 2 of my three custom fields? Is there a way to change that?

[@meggsnbacon5440]

What if a customer picks multiple shirts but all different sizes ? anyway we could map each cart item to have the pick a size dropdown?

[@StripeDev]

Hi Meggs-only up to two fields are allowed for custom fields currently.

[@domi564]

Is there a way to add a default value for the text field? For instance if a user wants an engraving and I already know their name from my database, it would be nice if it would already be written in the text field and they could modify it later on if they wanted to

[@jsteele-stripe]

Not currently supported, but this is something we're thinking about. Would you want this specifically for text fields, or other field types too?

[@domi564]

@@jsteele-stripe I use text fields and I think it would be very useful for them specifically, but It would be nice for all types of fields such as dropdowns

[@jsteele-stripe]

​@@domi564Thanks for the feedback!

[@user-cr1fp1od4g]

Thanks this is very helpful, is there a way to add fields also in payment element, not only in checkout.

[@StripeDev]

Hi Jose! Custom fields are not available for Payment Element. Here are the customization options for Payment Element: stripe.com/docs/payments/customize-payment-element

[@user-zh9ld3or6q]

Is there a way to get all payments / subscriptions, where a custom field had a specific value?

[@mikkelfrederiksen8556]

Would really like to know if this is possible. Case: You have 5 sales people and you want to assign a Code to them. When a person makes a sale he can ask the customer to input this code in the custom field upon checkout. This would make it possible to track how a sales person is performing.

[@StripeDev]

Great question Thomas-it's currently not possible to list or filter Checkout Sessions by custom fields. Instead, you can utilize a webhook and listen for checkout.session.completed events containing the custom field data from the session upon completion/payment.

[@alexanderkrause9741]

Is it possible to add the custom field to existing customers to save data which was sent by them from the past via mail to have a valid database in the end?

[@StripeDev]

Hey! Metadata is a better fit for this use case. Check this out: stripe.com/docs/videos/developer-foundations?video=metadata

[@Met201101M]

How did you get to the code page (in the 1;44 minutes of the video)? Thanks!

[@StripeDev]

Hey! You'll find explanations and sample code for this in our documentation here: docs.stripe.com/payments/checkout/custom-fields#create-session.
Also, the code was written using our API documentation which provides everything you need to create a checkout session: docs.stripe.com/api/checkout/sessions/create.

[@JohnWood-xn4pe]

Is there any way for a webhook to validate and possibly reject something put into the custom field? eg. if a particular size is out of stock, asking them to choose another?

[@StripeDev]

Hi John! It's not possible. Are you using Checkout / Payment Links in this case? For such a scenario, you would likely want some kind of real time request to your own backend server to check on the stock availability, this isn't something which Checkout Sessions is able to provide.
You can however consider manual capture and performing all of that logic validation i.e. confirming that there's sufficient stock, updating inventory before capturing the payment.

[@JohnWood-xn4pe]

@@StripeDev ok thanks, figured as much. Just wanted to be able to use Checkout without having to recreate the interface. We'll find a workaround, thanks for the response though.

[@danielfernandez7829]

@StripeDev What can be done in a case like this where we need to validate some user input, without having to implement something like Checkout, which you guys have already done? Collecting the user input before proceeding to Checkout? Or using something more advanced like Elements?

[@Luminousfoods]

I know this is very basic.... how do I get to the code area for stripe? I'm just not seeing where that is for my product.

[@StripeDev]

Hi there-we'd recommend checking out our quickstart guide for setting up your development environment: stripe.com/docs/development/quickstart

[@cgrist95]

Is it possible to pre-fill custom fields from the front end?

[@StripeDev]

Hi Charlie! Unfortunately it's not possible to pre-fill custom fields.

[@theJasta]

This is great news. I love how Stripe is so innovative. I am trying to retrieve the customer facing promo code 'code' (or equivalent) in a web hook but been told its not possible with one off payments with the payment intent and checkout session events... wondering if there is work around here? Could i create a hidden custom field that copies the promo code field?? Any suggestion would be appreciated.

[@StripeDev]

It should be possible to do this, just in case, have you checked our API reference to ensure you're retrieving it correctly? stripe.com/docs/api/promotion_codes/retrieve.

[@HenryVallenilla]

Hi @StripeDev there some way to add default value for a custom field ? Thanks

[@StripeDev]

Hey Henry-good question! It's not currently possible to add a default value for custom fields, but we very much appreciate the suggestion and will be sure to pass it along.

[@HenryVallenilla]

Thank you@@StripeDev awesome

[@kleberricardo9151]

Hello! I use Stripe on Shopify and need to add an information field at checkout, is the process the same? I only have products registered on Shopify and I use stripe as a Gateway, thanks in advance my friend!

[@StripeDev]

Thanks for reaching out-great question! You'll want to check with Shopify on this first-since they manage the integration, they might have different options or requirements to do this. They can help you get everything sorted out!

[@bry489]

I have been wanting to sell a product with customization in mind. How can I add more than 2 Custom Fields?

[@StripeDev]

Hey Bryan, only up to two custom fields are allowed. We're sorry about the inconvenience here, but we'll be sure to note your request for updates moving forward.

[@jsteele-stripe]

We've just increased the custom fields limit to 3. Let us know if that works for you!

[@amitsamadder666]

Hello Sir, I have a question about the custom_fields. How can I show the custom_fields data in the invoice? please let me know, it will help me a lot. Thanks in advance. by the way I am using next js (API)

[@StripeDev]

Hi Amit! Check out the docs here for adding custom fields to invoices: docs.stripe.com/invoicing/customize#custom-fields

[@mikodigital2226]

@@StripeDev ok so when you call our webhook, i call the stripe api to update the custom field on the invoice but the invoice is locked because it s finalized. so now i guess i need to remove the "invoice_creation.enabled" when i create the checkout sessiion in the firts place. but can i create an draft invoice on a payment later on? (then i can update it and finalize it). which routes will i use? thanks

[@StripeDev]

Hi Miko-it sounds like you need to stop the Stripe Billing engine from automatically finalizing, reattempting payments on, sending reminders for, or automatically reconciling invoices so you can edit it before finalization. If that's the case, you'll want to make sure you pass auto_advance=false.

[@arnavgupta8811]

How can I get checkout session custom fields if I only have invoice id?

[@arnavgupta8811]

I wanted to fetch the custom fields on the backend

[@StripeDev]

Hi there. You can check this documentation about customizing invoices: stripe.com/docs/invoicing/customize.a

[@kashifrizwanm]

is there a way to export custom field data in reports???????

[@StripeDev]

Hey Kashif, yes-you have the option to export multiple metadata fields in reports: support.stripe.com/questions/customizing-your-reports.
If you're looking for something more specific, please let us know-we're happy to help in any way that we can.

[@coconut.supplements]

How can I retrieve the customer's information from custom fields without code?

[@StripeDev]

Hey there-you can follow these steps to retrieve customer information from custom fields without code:
-Go to your Stripe Dashboard.
-On the left menu, click on "Customers". This will open a page with a list of all your customers.
-Find the customer whose information you want to retrieve and click on their name.
-On the customer's page, scroll down to the "Metadata" section. In this section, you'll find the custom fields that you or your developers might have saved. If you cannot find the Metadata section, it means that no custom fields were recorded for that specific customer.

[@instantbenefices]

thnaks for this tutorial. But to retrieve these custom values after payment

[@StripeDev]

Hey Luz. Here we show how to Retrieve custom fields: stripe.com/docs/payments/checkout/custom-fields#retrieve-fields

[@instantbenefices]

@@StripeDev Thanks

[@instantbenefices]

@@StripeDev Hello. Please I follewed and create payment link but can't retrieve detail from webhook

[@instantbenefices]

can't we receive webhook about paymentlinks ?

[@StripeDev]

Hi Luz-you should be able to set up trigger updates from any successful payment, including from payment links: stripe.com/docs/cli/trigger#trigger-event.
Are you running into any issues with this?