Skip to main content

Admin: Stripe Integration

Use Admin > Integrations > Stripe when your Genie app needs to accept payments, subscriptions, deposits, bookings, product sales, donations, or paid plan signups.

Stripe is a payment provider. CloudMySite helps connect your app to Stripe, but your Stripe account controls payment processing, balances, refunds, disputes, tax settings, and payouts.

What Stripe Setup Does​

Stripe setup has two main parts:

  • Connect Stripe credentials: This lets the app talk to your Stripe account securely.
  • Connect Stripe to an app checkout: This links a specific checkout page, pricing button, buy button, or subscription action in your app to Stripe.

Both parts are needed for a complete payment flow.

Before You Begin​

You should have:

  • A Stripe account.
  • Access to Stripe API keys.
  • A product, service, price, or subscription plan you want to sell.
  • A Genie app with a checkout page, pricing section, buy button, or subscription action.

If your app does not have a checkout area yet, ask Genie to add one before connecting Stripe.

Prompt examples:

Add a pricing page with three plans and a checkout button for each plan.
Add a buy button for the starter package on the homepage.
Create a subscription section with monthly and yearly plans.

Step 1: Open Stripe in Admin​

  1. Open your Genie app.
  2. Select Admin.
  3. Open Integrations.
  4. Choose Stripe.

You will see whether Stripe is connected, whether the app is in test or live mode, and whether a checkout is already linked.

Step 2: Connect Stripe​

  1. Select Connect Stripe.
  2. Enter your Stripe Secret Key.
  3. Enter your Webhook Signing Secret if you have one.
  4. Choose Test or Live mode.
  5. Select Save Stripe setup.

Test Mode​

Use Test mode when setting up a new app. Test mode lets you confirm the checkout experience without real charges.

Live Mode​

Use Live mode only when you are ready to accept real payments from customers.

Before switching to live mode, make sure:

  • the app is published
  • the checkout flow has been tested
  • your Stripe account is ready for payouts
  • your product names and prices are correct
  • your success and cancellation pages make sense

Step 3: Connect Stripe to an App Checkout​

After Stripe credentials are saved:

  1. Select Connect Stripe to app checkout or Connect checkout.
  2. Admin scans the app for checkout pages, pricing calls to action, buy buttons, and subscription actions.
  3. Choose the checkout item you want Stripe to control.
  4. Select the checkout type.
  5. Review product mapping.
  6. Confirm the connection.

When complete, the checkout should show a status such as Connected to app checkout.

Checkout Types​

You may see different checkout types.

Hosted Stripe Checkout​

Hosted Stripe Checkout sends the visitor to a Stripe-hosted checkout page.

This is the simplest option for most users. Stripe handles the payment screen.

Subscription Checkout​

Subscription Checkout is for recurring payments, such as monthly or yearly plans.

Use this for memberships, SaaS plans, subscriptions, retainers, or recurring service packages.

Payment Link uses a Stripe-hosted payment link.

This can be useful if you already created payment links in Stripe and want your app button to send visitors there.

Product Mapping​

Product mapping tells Admin what each checkout item represents.

For example:

  • Starter Plan - $19 per month
  • Pro Plan - $49 per month
  • Consultation - $100 one time
  • Donation - visitor chooses amount

Keep names simple and customer-friendly. These names may appear in checkout summaries or internal records.

Success and Cancel Pages​

Stripe checkout usually needs two return paths:

  • Success path: where visitors go after payment succeeds.
  • Cancel path: where visitors go if they cancel checkout.

Good success pages include:

  • Thank You
  • Payment Complete
  • Order Received
  • Booking Confirmed

Good cancel pages include:

  • Checkout Cancelled
  • Return to Pricing
  • Try Again

If your app does not have these pages, ask Genie to add them.

Testing Stripe​

After connecting Stripe:

  1. Keep Stripe in Test mode.
  2. Open the checkout page from Admin.
  3. Try the checkout flow.
  4. Publish the app if full Stripe checkout does not open in preview.
  5. Test again from the live published URL.
  6. Confirm the payment appears in your Stripe dashboard.

Stripe payment screens may not fully open inside the embedded preview. This is expected. Use the published app for the most accurate payment test.

Updating Stripe Later​

Use Update Stripe connection when:

  • you changed Stripe keys
  • you are switching from test to live mode
  • you changed webhook settings
  • you need to reconnect after a Stripe account change

After updating, test checkout again.

Rebinding Checkout​

Use Rebind app checkout or Scan app checkout when:

  • Genie changed the checkout page
  • you added a new pricing section
  • you moved the buy button
  • you connected the wrong checkout item
  • you redesigned the app after Stripe setup

Rebinding lets you choose the correct checkout target again.

Disconnecting Stripe​

Use Disconnect if the app should no longer accept Stripe payments.

After disconnecting:

  • the saved Stripe setup is removed from the app
  • connected checkout actions should no longer send payments to Stripe
  • old Stripe payment records remain in your Stripe dashboard

Always test the app after disconnecting, especially if payment buttons remain visible.

Safety Tips​

  • Do not paste Stripe secret keys into page text, chat prompts, visible buttons, or public content.
  • Use Admin's Stripe setup screen for Stripe keys.
  • Start in test mode.
  • Publish and test before switching to live payments.
  • Keep product names and prices clear.
  • Confirm refunds, taxes, receipts, and payout settings inside Stripe.

Troubleshooting​

I Do Not See a Checkout to Connect​

Ask Genie to add a checkout page, pricing button, buy button, or subscription section. Then return to Admin > Integrations > Stripe and scan again.

Stripe Is Connected but Checkout Does Not Open​

Try the published app. Stripe checkout may not fully open in embedded preview.

The Wrong Button Opens Stripe​

Use Rebind app checkout and choose the correct checkout item.

I Switched to Live Mode and Payments Fail​

Check that you used live Stripe keys, not test keys. Also confirm your Stripe account is fully activated.

I Am Not Sure Which Key to Use​

Use your Stripe secret key for the selected mode:

  • test keys usually start with sk_test_
  • live keys usually start with sk_live_

Keep secret keys private.