# Stripe Connect

## Before You Begin

* Ensure you have created a [Stripe](https://stripe.com) account, set it up for [Stripe Connect](https://help.adalo.com/component-basics/marketplace-components/stripe/marketplace-payments/set-up-your-stripe-account-for-stripe-connect), and completed any required verification.
* ***Users must be Logged in*** for the Component to work correctly.

## Walkthrough

### Add the Stripe Connect Component to your App

1\) Click the "+" button to open the Add Panel

2\) Scroll down to *Installed*

3\) Drag the Stripe Connect component onto your desired screen. Ideally, on the screen where merchants can edit their profile.

{% hint style="warning" %}
Stripe Connect Component **must** be set up in apps using the Marketplace Payment Component even if a separate Merchant App is used to collect Merchant Data.
{% endhint %}

### Configure your Connect Component

1. Click the Connect with Stripe button to connect your Stripe account
2. Copy URI from Stripe Component: ***<https://stripe-v3.adalo.com/stripe>***
3. Go to [Stripe Dashboard | Connect Settings](https://dashboard.stripe.com/test/settings/connect/onboarding-options/oauth)
4. Click <img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2FeyUyFKF4YB4FK9Gp0AxQ%2FScreen%20Shot%202022-08-25%20at%2012.22.33%20PM.png?alt=media&#x26;token=86ff9a74-23c3-45b2-98da-f60ed4501a53" alt="" data-size="line"> at bottom of Screen and paste URI and Save &#x20;

   <figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2Fo50VRDJjdBaxwzK0hdTK%2FScreenshot%202026-03-05%20at%209.30.18%E2%80%AFAM.png?alt=media&#x26;token=b6172875-5eae-4342-b355-c185679acc93" alt="" width="374"><figcaption></figcaption></figure>
5. Copy the Live mode client ID (Note these are different for both Live and Test Mode)
6. Paste Client ID in Connect Component under ***Stripe Client ID***
7. Add Secret and Publishable Keys from [Stripe Dashboard | API Keys](https://dashboard.stripe.com/apikeys)
   1. Test Mode API Keys will only work with the Test Mode Client ID.&#x20;
8. Under Stripe Account ID:
   1. Select where in the Database to save the Merchant's Stripe Account ID so you can access it later using MagicText.

### Test Mode

1. Open Stripe [Dashboard | Connect Settings](https://dashboard.stripe.com/test/settings/connect)
2. Scroll to bottom of Screen and toggle Test Mode on.

   <figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2FIdfT1njY4sNulVgws4bG%2FScreen%20Shot%202022-08-25%20at%203.02.06%20PM.png?alt=media&#x26;token=35f7cd13-d534-4f35-be85-37b3c84d6ad1" alt=""><figcaption></figcaption></figure>
3. Click <img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2FeyUyFKF4YB4FK9Gp0AxQ%2FScreen%20Shot%202022-08-25%20at%2012.22.33%20PM.png?alt=media&#x26;token=86ff9a74-23c3-45b2-98da-f60ed4501a53" alt="" data-size="line"> and add the Adalo Redirect URI.

   <figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2Fo50VRDJjdBaxwzK0hdTK%2FScreenshot%202026-03-05%20at%209.30.18%E2%80%AFAM.png?alt=media&#x26;token=b6172875-5eae-4342-b355-c185679acc93" alt="" width="374"><figcaption></figcaption></figure>
4. Copy the *Test mode client ID* and paste into the *Stripe Client ID* section of the Connect component.
5. Enter your Stripe Test Secret Key and Test Publishable Key into Connect component.
   * [Stripe | API Keys Documentation](https://stripe.com/docs/keys) can walk you through setting this up in your Stripe Account
6. Open Previewer and complete Stripe Connect flow.

### Testing Successful

When you have finished testing your Connect component and want to go live you will have to make sure you change the Secret Key, Publishable Key, and Client ID back to Live Mode credentials.

## Help

If you need additional help with this article, you can always ask in our [community forum](https://forum.adalo.com/)! Be sure to paste the link to this article in your post as well!