Weebly

**Square credentials (needed for all e-commerce data):** Go to **developer.squareup.com** and log in with your Square account (the same account used for your Weebly store — Weebly stores connect to a Square seller account). In the Square Developer Dashboard, click **My Applications** → select your application (or click **Create Your First Application** if none exists — name it 'Bubble Integration'). In the left sidebar, click **Credentials**. You see two sets of credentials: Sandbox (for testing) and Production. For real store data, copy the **Production** → **Personal Access Token**. This is a long string starting with `EAA`. Keep this secret — it grants full access to your Square account. Also note the **Application ID** (starts with `sq0idp-`) — some Square API endpoints require this too. **Find your Weebly store's Square location ID:** Every Weebly store corresponds to a Square 'location'. You need this location ID to filter orders to your specific store. You will fetch the location ID via the API in Step 3. For now, note that once you have the Square API Connector configured, a single call to `GET /v2/locations` will list all your Square locations — your Weebly store appears as one of them with a descriptive name. **Weebly legacy API token (needed for form submissions and blog content):** Go to **dev.weebly.com** and log in with your Weebly credentials. Create a developer app and follow the OAuth flow to generate an access token for your Weebly site. Copy the token and your **site ID** (a numeric string in your Weebly admin URL or the API response). Store all credentials securely — they will be entered into Bubble's API Connector in the next steps.

In your Bubble editor, go to **Plugins tab** → **Add plugins** → search **API Connector** → install the plugin by Bubble (free). Open the API Connector configuration panel. Click **Add another API** and name it `Square API`. Set **Authentication** to **No authentication** (you handle auth via headers). Under **Shared headers**, click **Add a shared header**: - **Name**: `Authorization` - **Value**: `Bearer YOUR_SQUARE_PERSONAL_ACCESS_TOKEN` - **Tick the Private checkbox** — this keeps your Square token server-side Add a second shared header: - **Name**: `Square-Version` - **Value**: `2024-01-18` (use the most current stable Square API version from developer.squareup.com/docs/api/latest) - **Leave Private unchecked** (this is a non-sensitive version string) ```json { "api_name": "Square API", "authentication": "none", "shared_headers": { "Authorization": "Bearer <private: SQUARE_PERSONAL_ACCESS_TOKEN>", "Square-Version": "2024-01-18" } } ``` **Add the Locations call first** (needed to find your store's location ID): - **Name**: `Get Locations` - **Use as**: **Data** - **Method**: GET - **URL**: `https://connect.squareup.com/v2/locations` Click **Initialize call**. Square returns a `locations` array. Set Data path to `locations`. Each location has an `id` (the location ID you need), `name`, `address`, and `status` fields. Find your Weebly store's location in the results and note its `id` — you will use this as a fixed value in the Orders Search call.

1{
2  "api_name": "Square API",
3  "authentication": "none",
4  "shared_headers": {
5    "Authorization": "Bearer <private: SQUARE_PERSONAL_ACCESS_TOKEN>",
6    "Square-Version": "2024-01-18"
7  },
8  "locations_call": {
9    "method": "GET",
10    "url": "https://connect.squareup.com/v2/locations"
11  }
12}

Square's order retrieval uses a POST request to `/v2/orders/search` with a JSON body — not a GET request. This is the most common gotcha for Square API beginners in Bubble. In the Square API group, click **Add a call**: - **Name**: `Search Orders` - **Use as**: **Data** - **Method**: **POST** (important — must be POST) - **URL**: `https://connect.squareup.com/v2/orders/search` - **Body type**: **JSON** In the **Body** section, enter the search filter JSON. Use your actual location ID as the fixed value: ```json { "location_ids": ["YOUR_LOCATION_ID"], "query": { "filter": { "state_filter": { "states": ["OPEN", "COMPLETED"] }, "date_time_filter": { "created_at": { "start_at": "<dynamic:start_date>", "end_at": "<dynamic:end_date>" } } }, "sort": { "sort_field": "CREATED_AT", "sort_order": "DESC" } }, "limit": 20 } ``` For the Initialize call, use fixed dates in the start_at and end_at fields (ISO 8601 format, e.g., `2024-01-01T00:00:00Z` and `2024-12-31T23:59:59Z`) to ensure Square returns real order data. Click **Initialize call**. Square returns a response with an `orders` array. Set Data path to `orders`. Bubble detects order fields including `id`, `state`, `created_at`, `updated_at`, `total_money` (with `amount` and `currency` sub-fields), `line_items` (array), `customer_id`, `fulfillments`, and `net_amounts`. For customer name display, note that Square orders often contain a `customer_id` reference rather than inline customer data — a second call to `GET /v2/customers/{customer_id}` fetches the name, email, and phone for a specific customer.

1{
2  "method": "POST",
3  "url": "https://connect.squareup.com/v2/orders/search",
4  "headers": {
5    "Authorization": "Bearer <private: SQUARE_PERSONAL_ACCESS_TOKEN>",
6    "Square-Version": "2024-01-18",
7    "Content-Type": "application/json"
8  },
9  "body": {
10    "location_ids": ["<YOUR_LOCATION_ID>"],
11    "query": {
12      "filter": {
13        "state_filter": {
14          "states": ["OPEN", "COMPLETED"]
15        },
16        "date_time_filter": {
17          "created_at": {
18            "start_at": "<dynamic:start_date_iso8601>",
19            "end_at": "<dynamic:end_date_iso8601>"
20          }
21        }
22      },
23      "sort": {
24        "sort_field": "CREATED_AT",
25        "sort_order": "DESC"
26      }
27    },
28    "limit": 20
29  }
30}

For Weebly-specific data (form submissions, blog posts, site pages), add a second API Connector group. Click **Add another API** and name it `Weebly API`. Set **Authentication** to **No authentication**. Under **Shared headers**, add: - **Name**: `Authorization` - **Value**: `Bearer YOUR_WEEBLY_OAUTH_TOKEN` - **Tick Private checkbox** Add a second shared header: - **Name**: `Content-Type` - **Value**: `application/vnd.weebly.v1+json` - Leave Private unchecked (this is a non-sensitive content type specifier) ```json { "api_name": "Weebly API", "authentication": "none", "shared_headers": { "Authorization": "Bearer <private: WEEBLY_OAUTH_TOKEN>", "Content-Type": "application/vnd.weebly.v1+json" } } ``` **Add the form entries call:** - **Name**: `Get Form Entries` - **Use as**: **Data** - **Method**: GET - **URL**: `https://api.weebly.com/v1/user/sites/{site_id}/forms/{form_id}/entries.json` - Replace `{site_id}` with your actual Weebly site ID as a fixed value in the URL - Replace `{form_id}` with your actual form ID (find it in Weebly admin → Marketing → Forms → click a form, ID is in the URL) Add URL parameter: `page=1` (Weebly paginates using a page number parameter). Click **Initialize call**. Weebly returns a JSON array of form entries. Each entry has: `entry_id`, `created_date` (Unix timestamp in **seconds**), `updated_date`, and a `fields` object containing submitted values keyed by field label. **Caching recommendation**: set the Bubble API Connector's Cache duration for this call to 60 seconds. Weebly's legacy API has undocumented rate limits — repeated uncached calls can result in temporary 429 responses with no clear documentation on the limit. Caching protects against this. RapidDev's team often handles the dual Square + Weebly wiring for small business clients — if you're building more than a simple dashboard, a free scoping call at rapidevelopers.com/contact can save significant debugging time.

1{
2  "method": "GET",
3  "url": "https://api.weebly.com/v1/user/sites/YOUR_SITE_ID/forms/YOUR_FORM_ID/entries.json",
4  "shared_headers": {
5    "Authorization": "Bearer <private: WEEBLY_OAUTH_TOKEN>",
6    "Content-Type": "application/vnd.weebly.v1+json"
7  },
8  "call_params": {
9    "page": "<dynamic:page_number>"
10  }
11}

Weebly's `created_date` and `updated_date` fields in form entries are Unix timestamps in **seconds** (e.g., `1710000000`). Bubble's date operators expect milliseconds by default. To convert correctly in Bubble: In a Text element showing the entry date, use the expression: `This entry's created_date * 1000 :converted from timestamp` Multiplying by 1000 converts seconds to milliseconds, and `:converted from timestamp` parses it as a proper Bubble date. Then apply `:formatted as date` with your preferred format (e.g., 'MMM D, YYYY h:mm A'). **Building the combined Weebly + Square dashboard:** **Orders section** (Square data): - Add a Repeating Group bound to `Square API - Search Orders` - Bind date range inputs to `start_at` and `end_at` parameters using Bubble's `:formatted as text` operator with ISO 8601 format: `YYYY-MM-DDTHH:mm:ssZ` - Show: order `id` (or a shortened version), `state`, `created_at` formatted as date, `total_money's amount / 100` formatted as currency, and a count of `line_items` **Form submissions section** (Weebly data): - Add a second Repeating Group bound to `Weebly API - Get Form Entries` - Show: `entry_id`, `created_date * 1000 :converted from timestamp :formatted as date`, and individual fields from the `fields` object (navigate to specific field names based on your form's field labels) **Privacy rules**: go to **Data tab → Privacy** and ensure any Bubble data type storing customer emails (from form entries or Square customer data) is restricted to logged-in admin users. Form submission data and customer emails are personally identifiable information that should not be accessible to all Bubble app users. **Weebly OAuth token refresh**: Weebly's OAuth tokens expire. On a Bubble paid plan, create a Backend Workflow that refreshes the Weebly token via the OAuth refresh endpoint and updates the stored token in Bubble's API Connector. On the Free plan, manually rotate the token by updating the Shared header value in the API Connector when calls start returning 401.

If your Bubble app needs to display Weebly blog content (posts, titles, publish dates), add a blog posts call to the Weebly API group. Click **Add a call** in the Weebly API group: - **Name**: `Get Blog Posts` - **Use as**: **Data** - **Method**: GET - **URL**: `https://api.weebly.com/v1/user/sites/YOUR_SITE_ID/blog-posts.json` - Add URL parameter: `page=<dynamic>` for pagination ```json { "method": "GET", "url": "https://api.weebly.com/v1/user/sites/YOUR_SITE_ID/blog-posts.json", "headers": { "Authorization": "Bearer <private: WEEBLY_OAUTH_TOKEN>", "Content-Type": "application/vnd.weebly.v1+json" }, "call_params": { "page": "<dynamic:page_number>" } } ``` Click **Initialize call**. Weebly returns an array of blog post objects with fields: `post_id`, `title`, `post_body` (HTML), `created_date` (Unix seconds), `updated_date`, `author`, `post_url`. **Applying caching to Weebly calls:** In both the Get Form Entries and Get Blog Posts calls, look for the **Cache responses** setting (available in Bubble's API Connector call configuration). Enable caching with a duration of **60 seconds**. This prevents rapid sequential calls — such as a user switching between tabs quickly — from hitting Weebly's undocumented rate limits. **Displaying blog posts in a Repeating Group:** Add a Repeating Group bound to `Weebly API - Get Blog Posts`. Show the post title, formatted created_date (apply the multiply-by-1000 pattern from Step 5), author name, and a 'Read More' link using the `post_url` field. For the full post body (HTML content), use Bubble's HTML element and bind its value to `Current cell's post_body` — Bubble's HTML element renders HTML tags correctly.

1{
2  "method": "GET",
3  "url": "https://api.weebly.com/v1/user/sites/YOUR_SITE_ID/blog-posts.json",
4  "shared_headers": {
5    "Authorization": "Bearer <private: WEEBLY_OAUTH_TOKEN>",
6    "Content-Type": "application/vnd.weebly.v1+json"
7  },
8  "call_params": {
9    "page": "<dynamic:page_number>"
10  }
11}