> For the complete documentation index, see [llms.txt](https://docs.flowappz.com/home/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.flowappz.com/home/webflow-popup-builder/how-to-connect-your-popup-builder-with-a-webhook.md).

# How to Connect Your Popup Builder with a Webhook

#### Step 1: Add a New Integration

To connect your popup with external services like **Webhook**, follow the steps below:

1. Navigate to the **Integrations** tab.
2. Click on the **Add New Integration** button.\
   A modal will appear displaying a list of available integration options.
3. Click **Connect** next to the **Webhook** to proceed with the setup.

<figure><img src="/files/RkTWtFJsrBdggwxqYkle" alt=""><figcaption></figcaption></figure>

#### Step 2: Configure Webhook Integration

To connect a webhook, fill in the required fields as follows:

1. **Webhook Name**\
   Enter a name to identify your webhook integration.
2. **Webhook URL**\
   Provide the URL where the data should be sent.
3. **API Key**\
   Enter your API key for authentication.

   > 🔐 *If you don't have an API key, you can create and use any custom key of your choice.*
4. **Validate Connection**\
   Click the **Validate** button to test the connection with the provided credentials.\
   If the connection is successful, proceed to the next step.
5. **Save Integration**\
   Click the **Save** button to finalize and store your webhook integration settings.

<figure><img src="/files/gUmvub3FcEgdPh7FneB6" alt=""><figcaption></figcaption></figure>

#### Step 3: Connect Webhook to a Popup

To set up a webhook integration for a specific popup, follow these steps:

1. **Navigate to the Popups Tab**\
   From the Integrations, go to the **Popups** tab.
2. **Edit the Desired Popup**\
   Click on the **Edit Popup** button next to the popup you want to configure.
3. **Go to the Integrations Step**\
   In the popup builder, navigate to the **Integrations** step.
4. **Click “Add Integration”**\
   This will open a modal displaying all available integrations.
5. **Connect Webhook**\
   Click the **Connect** button next to **Webhook**.\
   A webhook connection setup form will appear.
6. **Configure the Webhook Connection**
   * Enter a **unique name** for this connection.
   * Select the previously added **Webhook API** from the dropdown list.
7. **Save the Connection**\
   Click the **Save** button to complete the integration setup.

> ✅ *Once saved, your popup will be connected to the selected webhook and ready to transmit data.*

<figure><img src="/files/CZUGVbHHgDI8uj5s2mi4" alt=""><figcaption></figcaption></figure>