# How to Integrate Slack Notifications in Bubble

- Tool: Bubble
- Difficulty: Beginner
- Time required: 15-20 min
- Compatibility: All Bubble plans
- Last updated: March 2026

## TL;DR

Sending Slack notifications from Bubble uses Slack's Incoming Webhooks, configured via the API Connector. This tutorial covers creating a Slack webhook URL, configuring the API Connector to send POST requests to Slack, formatting messages with Slack's Block Kit for rich notifications, and triggering Slack messages on specific app events like new orders, user signups, and error alerts.

## Overview: Slack Notifications in Bubble

This tutorial shows you how to send automated Slack notifications from your Bubble app to keep your team informed about important events in real-time.

## Before you start

- A Bubble app on any plan
- A Slack workspace with admin permissions
- The API Connector plugin installed
- Basic understanding of Bubble Workflows

## Step-by-step guide

### 1. Create a Slack incoming webhook

Go to api.slack.com/apps and click Create New App. Choose 'From scratch', name it, and select your workspace. Go to Incoming Webhooks → Activate Incoming Webhooks → Add New Webhook to Workspace. Select the channel where notifications should be posted and click Allow. Copy the Webhook URL — it looks like https://hooks.slack.com/services/T00/B00/xxxx. This URL is your endpoint for sending messages.

**Expected result:** You have a Slack webhook URL that can receive POST requests to send messages to your chosen channel.

### 2. Configure the API Connector for Slack

In Bubble, open the API Connector plugin. Add a new API called 'Slack'. Add a POST call named 'Send Notification'. Set the URL to your webhook URL. Set Content-Type header to application/json. In the Body, add a JSON payload with a 'text' parameter: {"text": "[message]"}. Mark the message parameter as not private (so it can be dynamic). Set 'Use as' to Action. Initialize the call with a test message. Check your Slack channel — the test message should appear.

**Expected result:** The API Connector sends messages to Slack successfully and is ready for use in workflows.

### 3. Format rich messages with Block Kit

Slack's Block Kit allows rich formatting. Replace the simple text body with a blocks array for structured messages. Use sections with markdown text for headers, fields for key-value pairs, and dividers for visual separation. Use Slack's Block Kit Builder (app.slack.com/block-kit-builder) to design your message visually and copy the JSON. In the API Connector body, insert the Block Kit JSON with dynamic Bubble data for variable content like order numbers, user names, and amounts.

```
{
  "blocks": [
    {
      "type": "header",
      "text": {"type": "plain_text", "text": "New Order Received"}
    },
    {
      "type": "section",
      "fields": [
        {"type": "mrkdwn", "text": "*Customer:*\n[customer_name]"},
        {"type": "mrkdwn", "text": "*Total:*\n$[order_total]"}
      ]
    },
    {
      "type": "section",
      "text": {"type": "mrkdwn", "text": "<[order_url]|View Order>"}
    }
  ]
}
```

**Expected result:** Slack messages display with rich formatting including headers, fields, and clickable links.

### 4. Trigger notifications on app events

Add Slack notification actions to your key workflows. New order placed: send a message with order details, customer name, and total. New user signup: send the user's name and email. Error logged: send the error message, source, and affected user. Payment failed: send the customer name and failure reason. For each event, add the Slack API call as a workflow action with dynamic data for the message fields. Use backend workflows for server-side events like webhook processing.

**Expected result:** Important app events automatically trigger formatted Slack notifications to your team channel.

### 5. Add multiple channels and notification routing

Create additional webhooks for different Slack channels (orders channel, errors channel, general channel). In the API Connector, create separate calls for each channel or make the webhook URL a dynamic parameter. Add logic to route notifications: order events go to #orders, errors go to #alerts, signups go to #growth. For sensitive notifications (errors with user data), send to a private channel. Add a toggle in your app settings to enable/disable each notification type.

**Expected result:** Notifications are routed to appropriate Slack channels based on event type.

## Complete code example

File: `API Connector payload`

```json
{
  "API_NAME": "Slack",
  "CALL_NAME": "Send Notification",
  "METHOD": "POST",
  "URL": "https://hooks.slack.com/services/T00/B00/xxxx",
  "HEADERS": {
    "Content-Type": "application/json"
  },
  "SIMPLE_MESSAGE": {
    "text": "[dynamic_message_text]"
  },
  "RICH_MESSAGE": {
    "blocks": [
      {
        "type": "header",
        "text": {"type": "plain_text", "text": "[event_title]"}
      },
      {
        "type": "section",
        "fields": [
          {"type": "mrkdwn", "text": "*Field 1:*\n[value_1]"},
          {"type": "mrkdwn", "text": "*Field 2:*\n[value_2]"}
        ]
      },
      {"type": "divider"},
      {
        "type": "section",
        "text": {"type": "mrkdwn", "text": "<[link_url]|View Details>"}
      }
    ]
  },
  "CHANNEL_ROUTING": {
    "orders": "webhook_url_for_orders_channel",
    "errors": "webhook_url_for_alerts_channel",
    "signups": "webhook_url_for_growth_channel"
  }
}
```

## Common mistakes

- **Hardcoding the webhook URL in multiple workflow actions** — If the webhook URL changes, you need to update it everywhere it is used Fix: Store the webhook URL in an app settings Data Type or use a single API Connector call referenced from all workflows
- **Sending too many notifications that create noise** — Teams start ignoring Slack channels flooded with low-value notifications Fix: Be selective about what triggers notifications. Send only actionable events that require team awareness or response.
- **Including sensitive user data in Slack messages** — Slack channels may have many members who should not see personal user information Fix: Send only necessary identifiers in Slack messages and link to the admin panel for full details

## Best practices

- Send only actionable notifications to avoid channel noise
- Use Block Kit formatting for clear, structured messages
- Route different event types to appropriate channels
- Include direct links to relevant admin pages in messages
- Do not include sensitive personal data in Slack messages
- Add notification toggles so you can disable categories without code changes

## Frequently asked questions

### Is the Slack webhook free?

Yes. Slack incoming webhooks are free and included in all Slack plans including the free tier.

### Can I send messages to multiple channels?

Yes. Create separate webhooks for each channel and configure separate API Connector calls for each one.

### Can users respond to notifications in Slack?

Incoming webhooks are one-way (Bubble to Slack). For interactive messages with buttons, you need a full Slack App with interactive components and a callback URL.

### How do I test without spamming my team?

Create a test channel and webhook for development. Only switch to production channels when your notification system is finalized.

### Can I format text with bold and links?

Yes. Slack uses markdown-like formatting: *bold*, _italic_, and <url|text> for links. Block Kit provides even richer formatting options.

### Can RapidDev help integrate Slack with my Bubble app?

Yes. RapidDev can set up comprehensive Slack integrations including bidirectional messaging, slash commands, and interactive workflows.

---

Source: https://www.rapidevelopers.com/bubble-tutorial/integrate-slack-notifications-in-bubble
© RapidDev — https://www.rapidevelopers.com/bubble-tutorial/integrate-slack-notifications-in-bubble
