⭐ Available in the following bundle: Conversion Bundle (incl. in Growth, Scale)
⭐ Available on the following plans: Business
👀 Not sure which plan you're on? Check your subscription here.
Let your visitors complete purchases directly from your funnel with the Stripe Checkout block. Integrate payments and transactions with ease, making the entire process secure, convenient, and hassle-free for your funnel visitors. Let flow visitors complete one-time purchases without leaving the site!
❗Are you currently trialing Heyflow? For security reasons, this feature is not available during the trial period. If you have any questions or need support, feel free to reach out via the chat or email us at [email protected].
❗Important: The Stripe Checkout Block is only visible in live mode and the published flow, but not in the edit mode.
How does it work
The design of your Stripe block depends on your Stripe presets. You can select from different Stripe presets in the “Appearance” tab in the block settings.
For security reasons, you can only set one amount per checkout block. If you would like to add multiple checkout options with different amounts to your funnel, we recommend, including multiple pages with Stripe checkout blocks and routing your flow visitors to the applicable one with conditional logic.
By default, the Stripe Checkout block accepts credit card payments. To enable additional payment options such as Apple Pay or Google Pay, you’ll need to complete some extra configuration in your Stripe account (see FAQ). Please note that other payment methods (e.g., PayPal, bank transfers) are not supported through this block.
Moreover, we don't support the block inside embedded flows yet.
❗ Please note: This feature will initially be released as a Beta version, providing Heyflow customers with free access. Please note that in the future, we may introduce a revenue share or flat fee pricing structure.
Initial setup of Stripe Integration
Click on your initials in the top right corner to open your Account settings and go to “Integrations”.
Select “Add integration” and a pop-up window will appear. Here you need to select Stripe.
You will be prompted to enter your Stripe credentials to authenticate your account.
Now that you have connected Stripe, you can add the Stripe checkout block to any funnel!
Update the Content
After clicking on a building block, you’ll find the Content section on the right.
First, update the Button label you'd like to show to the users. Finally, specify the Success message, which is the text displayed to users once their payment has been completed successfully.
🔎 The Stripe Block button color is always the secondary color. Learn more about the general flow theme here.
Change the Settings
After clicking on a building block, you’ll find the Settings section on the right. This is where you can customize the block’s style, appearance, and behavior to tailor it perfectly to your flow.
General
In the General settings, you can configure all details related to processing payments. First, select the Stripe account you want to connect.
Then choose the currency for the transaction, either EUR (€) or USD ($). Next, define the price of the payment. You can also send values from your flow to Stripe, e.g. name, email, and phone.
❗ Important: Keep in mind that any change to the price takes effect immediately and updates the published flow without delay.
Navigation
Under Navigation you can select what happens after the Stripe payment:
Next page: Go to next page in order
Go to page: Choose a specific page
Redirect: Navigate to another webpage
Submit: Submit the form
Advanced Conditional Logic: Define advanced rules to navigate users
Appearance
Set the block’s visibility to show only on mobile, desktop, or hide it completely. Additionally, you can select a background color for the block.
For the layout you can choose between Automatic, Tabs and Accordion. Also, you can select a different Stripe Theme, e.g. Night, Flat, Minimal, Ninety Five, Bubble Gum or Dark Blue Theme.
❗ Important: The language of the block adjusts automatically depending on the user's browser language.
Spacing
Control the block’s layout by adjusting its width (S, M, L, or maximum) and setting the block's padding from the top, bottom, left, and right.
Labels & Variables
System Labels define how your data is stored and organized.
Tracking
If Tracking is activated for that block, you can give the successful payment an event name that will be sent to your connected tracking tools. You can find more information about tracking here.
Best Practices & FAQ
❓Can I use different currencies?
❓Can I use different currencies?
Currently, the block supports only Euro (EUR) and US Dollar (USD). You can select your preferred currency within the block settings.
❓Do I need my own Stripe account?
❓Do I need my own Stripe account?
Yes, a Stripe account is required. All payments are processed securely through your connected account, giving you full control over your funds.
❓ Does this work with Stripe subscriptions?
❓ Does this work with Stripe subscriptions?
Not at the moment. This block currently supports one-time payments only.
❓ Are payments secure?
❓ Are payments secure?
Absolutely. All transactions are handled by Stripe, which uses industry-standard encryption and security measures to keep payments safe.
❓ How do I enable Apple Pay or Google Pay for my Stripe Block?
❓ How do I enable Apple Pay or Google Pay for my Stripe Block?
To enable Apple Pay and Google Pay in your Stripe Checkout block, follow these steps:
In your Stripe Dashboard, go to Settings → Payments under Product Settings.
Under Payment Method Domains, add the domain of your funnel.
Next, go to Payment methods, open your configuration, and turn on Apple Pay and Google Pay.
These payment options will automatically appear for mobile visitors who have either Apple Pay or Google Pay set up on their devices.
⭐ Use in Stand-alone flows only
⭐ Use in Stand-alone flows only
The Stripe block currently works only in stand-alone flows. Embeds are not supported.
⭐ Be transparent about costs
⭐ Be transparent about costs
Display the price, currency, and any additional fees before the payment step.