How to accept card payments in Bubble

You accept card payments in Bubble by using the Stripe plugin (the official Bubble one), which gives you a Stripe Payment Element that can securely collect card details. Bubble never handles raw card numbers; Stripe handles that part. Your workflow is usually: create a Stripe customer → generate a payment → confirm the payment → store the result in your Database. This works for one‑time payments or subscriptions.

Core Steps to Accept Card Payments

Below is the simplest valid approach that works reliably for beginners and real apps.

• Install Stripe plugin: In the Plugin tab, add the official Bubble “Stripe” plugin. Connect your Stripe API keys (test mode first).
• Place the Stripe Payment Element: On your page, drop the “Stripe Payment Element” visual element. This is the UI that accepts the card number securely.
• Create a PaymentIntent: In your workflow (usually a “Pay” button), use the action “Stripe - Create a PaymentIntent”. Set the amount and currency.
• Confirm the PaymentIntent: After creation, run the action “Stripe - Confirm PaymentIntent” and choose the Payment Element on the page as the source.
• Handle success/failure: Stripe returns a status. On success, store the PaymentIntent ID in your database (ex: in the User or in an Order).

Important Bubble Concepts

PaymentIntent is Stripe’s object for charging cards. Bubble’s plugin creates it for you. Client Secret is what the Payment Element uses behind the scenes; Bubble handles it automatically. You don’t store card numbers; you store Stripe IDs.

Example: Charge $20 Button Workflow

// Step 1: Create PaymentIntent
Stripe - Create a PaymentIntent
amount: 2000        // amount in cents
currency: usd

// Step 2: Confirm it using the payment element
Stripe - Confirm PaymentIntent
payment intent: Result of step 1
payment element: StripePaymentElement A

// Step 3: After success, save result
Make changes to Current User
field: last_payment_intent = Result of step 2's id

This setup lets you accept real card payments securely without touching sensitive data. It works for one‑time payments, and for subscriptions you’d instead use “Stripe - Create a Subscription” with the Payment Element as the payment method.