Hootsuite

Navigate to hootsuite.com/developers and sign in with your Business or Enterprise Hootsuite account. Click 'Create App'. Fill in the App Name (e.g., 'Bubble Social Dashboard'), the App Website URL (your Bubble app URL), and a brief Description. Set the Redirect URI to a URL you control — for initial setup, this can be your Bubble app's page URL or a simple HTTP response catcher service. Request the following OAuth scopes: offline (required for refresh token issuance — without this scope, you receive no refresh token and must re-authorize manually every 7 days), read:social_profile, and write:owned_messages. Additional scopes for analytics: read:analytics, and for inbox: read:owned_messages. Note your Client ID and Client Secret from the app settings page. To obtain initial tokens, construct the authorization URL: https://platform.hootsuite.com/oauth2/auth?response_type=code&client_id=YOUR_CLIENT_ID&redirect_uri=YOUR_REDIRECT_URI&scope=offline%20read:social_profile%20write:owned_messages Open this URL in your browser. Hootsuite shows an authorization screen — approve it. Hootsuite redirects to your Redirect URI with a ?code= parameter in the URL. Copy the code value. Exchange the code for tokens by making a POST request to https://platform.hootsuite.com/oauth2/token with: - grant_type=authorization_code - code=[your code] - client_id=[your client id] - client_secret=[your client secret] - redirect_uri=[your redirect uri] You receive an access_token, refresh_token, and expires_in (seconds). Note the current time plus expires_in to calculate expires_at. Store all three values — you'll put them in Bubble's database in the next step.

1{
2  "authorization_url": "https://platform.hootsuite.com/oauth2/auth?response_type=code&client_id=YOUR_CLIENT_ID&redirect_uri=YOUR_REDIRECT_URI&scope=offline%20read:social_profile%20write:owned_messages",
3  "token_exchange_request": {
4    "method": "POST",
5    "url": "https://platform.hootsuite.com/oauth2/token",
6    "body": {
7      "grant_type": "authorization_code",
8      "code": "<authorization_code_from_redirect>",
9      "client_id": "<your_client_id>",
10      "client_secret": "<your_client_secret>",
11      "redirect_uri": "<your_redirect_uri>"
12    }
13  },
14  "token_response": {
15    "access_token": "eyJhbGciOiJSUzI1Ni...",
16    "refresh_token": "7a8b9c0d1e2f3g4h...",
17    "token_type": "Bearer",
18    "expires_in": 604800
19  }
20}

In Bubble's Data tab, create a new data type called 'HootsuiteToken'. Add the following fields: - access_token (text) — the current valid Bearer token for API calls - refresh_token (text) — used to obtain a new access_token before expiry - expires_at (date) — the date/time when the current access_token expires (7 days from issuance) - social_profiles (list of texts) — stores social profile IDs to avoid re-fetching on every page load - last_refreshed (date) — for monitoring and debugging the refresh schedule Now create an admin page in Bubble where you can manually enter the initial tokens. Add three inputs (or use a Bubble popup): Access Token, Refresh Token, Expires At (date/time picker set to 7 days from now). Add a workflow: on button click → 'Create a new HootsuiteToken' with the input values. This creates the initial token record in your Bubble database. IMPORTANT: Set privacy rules on the HootsuiteToken data type immediately. Go to Data tab → Privacy → HootsuiteToken. Set rules so that only admin users (or no users via the Bubble Data API) can read this data type. The access_token and refresh_token fields are sensitive credentials — they must not be readable by non-admin users or exposed through Bubble's Data API. In a real multi-user app where each user connects their own Hootsuite account, this data type would have a 'user' field (linked to Bubble's User type) and privacy rules would allow users to read only their own record. For a single-organization integration (one Hootsuite account for your team), one HootsuiteToken record is sufficient.

1{
2  "data_type": "HootsuiteToken",
3  "fields": {
4    "access_token": "text",
5    "refresh_token": "text",
6    "expires_at": "date",
7    "social_profiles": "list of texts",
8    "last_refreshed": "date"
9  },
10  "privacy_rules": [
11    "No users can read HootsuiteToken records (protect tokens from Data API exposure)",
12    "Only admin users can create or modify HootsuiteToken records"
13  ]
14}

Go to Plugins → Add plugins → search 'API Connector' → Install (by Bubble, free). Click 'Add another API'. Name it 'Hootsuite'. Base URL: https://platform.hootsuite.com/v1 For the Authorization header, click 'Add a shared header'. Name: Authorization. Value: Bearer [reference the stored token dynamically]. Here is the key pattern: instead of entering a static token value, you set the shared header value to be dynamic. In Bubble's API Connector, this means you add a dynamic key that will be passed from each API call's context. Set the Authorization header value to: Bearer <dynamic: access_token> This makes 'access_token' a required dynamic parameter for every call. When you use any Hootsuite API action in a workflow, you pass the current token by setting access_token = 'Do a search for HootsuiteToken:first item's access_token'. Mark the access_token dynamic parameter as Private at the individual call level when configuring each call. This ensures the token value never reaches the browser even when dynamically sourced from the database. Add a second shared header: Content-Type with value application/json (this is needed for POST calls that send JSON bodies — Hootsuite's API uses JSON, not form encoding, unlike Buffer). Save the API configuration.

1{
2  "api_name": "Hootsuite",
3  "base_url": "https://platform.hootsuite.com/v1",
4  "shared_headers": {
5    "Authorization": "Bearer <dynamic: access_token (Private)>",
6    "Content-Type": "application/json"
7  },
8  "notes": [
9    "access_token is dynamic — passed from each workflow step referencing the current DB token",
10    "Mark access_token Private at each call level",
11    "All calls are server-side via Bubble's proxy — no CORS issues"
12  ]
13}

This step is the most critical for production stability. Navigate to Backend Workflows in your Bubble editor (requires a paid Bubble plan). Create a new API workflow named 'RefreshHootsuiteToken'. Set it to run as a Background API workflow (not triggered by a user action). This workflow will run on a schedule every 6 days. Workflow steps: Step 1 — Configure an API Connector call for the token refresh endpoint (add a separate call under your Hootsuite API configuration named 'Refresh Token'): - Method: POST - URL: https://platform.hootsuite.com/oauth2/token (note: this is different from the v1 API base URL) - Body type: Form parameters URL-encoded - Body parameters: - grant_type: refresh_token (static) - refresh_token: <dynamic: current_refresh_token> - client_id: <private: your_client_id> - client_secret: <private: your_client_secret> The response returns a new access_token, refresh_token, and expires_in. Step 2 — In the Backend Workflow, add the action: 'Call Hootsuite Refresh Token API' with current_refresh_token = 'Do a search for HootsuiteToken:first item's refresh_token'. Step 3 — Make changes to the HootsuiteToken record: access_token = Refresh Token API result's access_token, refresh_token = Refresh Token API result's refresh_token, expires_at = Current date/time + 7 days, last_refreshed = Current date/time. To schedule this workflow, go to the 'Recurring events' section in Backend Workflows. Create a recurring event that triggers 'RefreshHootsuiteToken' every 6 days. Start it from now. RapidDev's team has built production Hootsuite integrations in Bubble with token lifecycle management and multi-user OAuth flows — for complex social management tools, book a free scoping call at rapidevelopers.com/contact.

1{
2  "token_refresh_call": {
3    "method": "POST",
4    "url": "https://platform.hootsuite.com/oauth2/token",
5    "body_type": "Form parameters URL-encoded",
6    "parameters": {
7      "grant_type": "refresh_token",
8      "refresh_token": "<dynamic: current_refresh_token>",
9      "client_id": "<private: your_client_id>",
10      "client_secret": "<private: your_client_secret>"
11    }
12  },
13  "workflow_steps": [
14    "1. Call Refresh Token API with stored refresh_token",
15    "2. Make changes to HootsuiteToken: access_token = new token, refresh_token = new refresh token, expires_at = now + 7 days",
16    "3. Schedule this workflow to repeat every 6 days"
17  ]
18}

Now add the core API calls you'll use in your Bubble interface. Call 1 — Get Social Profiles: - Method: GET, Path: /socialProfiles - Use as: Data - Initialize with access_token from your stored HootsuiteToken - Response includes: id, type (TWITTER, INSTAGRAM, FACEBOOK, LINKEDIN), avatarUrl, socialNetworkId (the handle/username) - Store profile IDs in your HootsuiteToken record's social_profiles list field to avoid re-fetching on every page load Call 2 — Schedule Message: - Method: POST, Path: /messages - Body type: JSON - Body: { "text": "<dynamic: message_text>", "scheduledSendTime": "<dynamic: iso_time>", "socialProfileIds": ["<dynamic: profile_id>"] } - Use as: Action - Initialize with a test message text, a valid ISO 8601 UTC time (e.g., 2026-12-01T10:00:00.000Z), and a profile ID Call 3 — Get Scheduled Messages: - Method: GET, Path: /messages?state=SCHEDULED - Use as: Data - Response includes: id, text, scheduledSendTime, socialProfile objects For the ISO 8601 time conversion (Bubble's date type → Hootsuite's expected format), use the Toolbox plugin (by Zeroqode, free). In the 'Schedule Message' workflow step, add a 'Run JavaScript' action before the API call: use new Date(bubble_date).toISOString() to convert the Bubble date picker value to ISO format. Store the result in a custom state, then pass it to the API call. Build a profile dropdown on your page using a repeating group of the stored social profile IDs with their platform type displayed as icons.

1{
2  "schedule_message_body": {
3    "text": "<dynamic: message_text>",
4    "scheduledSendTime": "<dynamic: iso_8601_utc_time>",
5    "socialProfileIds": ["<dynamic: profile_id>"]
6  },
7  "iso_8601_javascript_conversion": "var bubbleDate = new Date(BUBBLE_DATE_VALUE); var isoString = bubbleDate.toISOString(); return isoString;",
8  "scheduled_message_response": {
9    "id": "617119843",
10    "text": "Our new feature is live!",
11    "scheduledSendTime": "2026-12-01T10:00:00.000Z",
12    "state": "SCHEDULED",
13    "socialProfiles": [
14      { "id": "12345678", "type": "TWITTER" }
15    ]
16  }
17}

Add the final UI elements to complete the social management panel. Scheduled Messages Repeating Group: - Add a repeating group to your page - Set data source to 'Get Hootsuite Scheduled Messages' API call with access_token = 'Do a search for HootsuiteToken:first item's access_token' - Add columns for: Message text (Current cell's text), Platform (Current cell's socialProfiles first's type), Scheduled time (Current cell's scheduledSendTime — display as formatted date) - Add a 'Delete' button per row that calls DELETE /messages/{id} Message Compose Form: - Multiline text input: Post Text - Date/time picker: Publish Time (add note: 'Times are in UTC') - Dropdown: Social Profile (options from stored social_profiles list) - Button: 'Schedule Post' Schedule Post workflow: 1. Run JavaScript (Toolbox) to convert date picker value to ISO 8601 UTC string → save to custom state 'IsoTime' 2. Call Hootsuite API 'Schedule Message' with: access_token = search HootsuiteToken:first item's access_token, message_text = Post Text input's value, iso_8601_utc_time = custom state IsoTime, profile_id = Profile Dropdown's value 3. Show success confirmation: 'Message scheduled for [Publish Time formatted]' 4. Reset form inputs Test the full round-trip: enter a post, pick a time 10 minutes in the future, select a profile, click Schedule. Verify the message appears in your Bubble scheduled messages repeating group and in the Hootsuite dashboard under Planner.