Thinkific

Before touching Bubble, gather the two credentials the API Connector needs. In your Thinkific dashboard, click your account avatar in the top-right corner, then choose Settings from the dropdown. In the left sidebar, look for the Code & API section (this section is only visible on Basic plan and higher — if you don't see it, your school is on the Free tier and needs an upgrade before proceeding). Click API in the Code & API section. If no key exists yet, click Generate API key. Copy the key immediately and store it in a password manager or secure note — Thinkific only shows the full key once at generation time. Now note your school subdomain. The easiest way: look at your browser's address bar while in the Thinkific admin. The URL format is myschool.thinkific.com/manage — the part before .thinkific.com is your subdomain. For example, if your admin URL is happycourses.thinkific.com/manage, your subdomain is happycourses. Important: the X-Auth-Subdomain header takes ONLY the subdomain value — not the full domain. Setting it to happycourses.thinkific.com instead of happycourses is a common mistake that causes a silent 401 error.

In your Bubble editor, open the Plugins tab from the left sidebar. Click the blue Add plugins button in the top-right. In the search box, type API Connector and press Enter. Find API Connector by Bubble in the results and click Install. Once installed, close the plugin marketplace overlay — the API Connector now appears in your Plugins list. Click on API Connector in the left panel. Click the red Add another API button. A new API Group configuration panel opens. Configure the API Group: - Name: Thinkific (this label appears in workflow dropdowns) - Authentication: click the dropdown and choose None — Thinkific authentication is handled through custom headers, not a built-in auth type - Shared headers: click Add a shared header twice to add two rows - Header 1: Key = X-Auth-API-Key, Value = paste your API key here, then check the Private checkbox next to it. The Private checkbox is critical — it tells Bubble to keep this value server-side and hide it from browser network requests. - Header 2: Key = X-Auth-Subdomain, Value = paste your school subdomain (just the slug, e.g., myschool — NOT myschool.thinkific.com) - Shared parameters (URL): no shared URL params needed at this level Do NOT click Private on X-Auth-Subdomain — the subdomain is not a secret and may need to vary in multi-tenant configurations. Leave the base URL blank for now; you will specify the full URL in each individual API Call.

1{
2  "api_group_name": "Thinkific",
3  "authentication": "None",
4  "shared_headers": [
5    {
6      "key": "X-Auth-API-Key",
7      "value": "<your-api-key-here>",
8      "private": true
9    },
10    {
11      "key": "X-Auth-Subdomain",
12      "value": "myschool",
13      "private": false
14    }
15  ]
16}

Inside the Thinkific API Group you just created, click Add another call. A new call row appears beneath the group header. Configure this call: - Call name: GetCourses - Method: GET - URL: https://api.thinkific.com/api/v1/courses - Use as: Data (not Action) — this tells Bubble the call returns data that can be bound to UI elements like Repeating Groups - URL parameters: click Add parameter and add two: - page: default value 1 - limit: default value 50 (Thinkific's maximum items per page) The Initialize call is mandatory in Bubble's API Connector before you can use a Data call — Bubble needs a real, successful API response to detect the response schema (field names and types). Without this step, you cannot bind the API response to UI elements. Click Initialize call. Bubble sends the actual GET request to Thinkific using your configured headers. If both headers are correctly set, Thinkific returns a JSON response containing a data array of course objects and a meta object. Bubble automatically detects fields from the response — look for the data array expanding to show fields like id, name, slug, description, price, product_id, course_card_image_url, and percentage_completed. Click Save to lock in the detected schema. If the Initialize call fails with 'There was an issue setting up your call', it almost always means one of two things: (1) the X-Auth-API-Key header value is wrong or missing the Private flag, or (2) the X-Auth-Subdomain header contains the full domain (myschool.thinkific.com) instead of just the slug (myschool).

1{
2  "call_name": "GetCourses",
3  "method": "GET",
4  "url": "https://api.thinkific.com/api/v1/courses",
5  "use_as": "Data",
6  "url_parameters": [
7    { "key": "page", "value": "1" },
8    { "key": "limit", "value": "50" }
9  ],
10  "sample_response": {
11    "items": [
12      {
13        "id": 123456,
14        "name": "Introduction to Marketing",
15        "slug": "intro-to-marketing",
16        "price": 9900,
17        "description": "Learn the fundamentals of modern marketing.",
18        "course_card_image_url": "https://cdn.thinkific.com/..."
19      }
20    ],
21    "meta": {
22      "total_count": 12,
23      "next_page": 2,
24      "previous_page": null
25    }
26  }
27}

Repeat the 'Add another call' process for the other main Thinkific endpoints you'll need. Here are the three most useful calls to add: GetEnrollments call: - Call name: GetEnrollments - Method: GET - URL: https://api.thinkific.com/api/v1/enrollments - Use as: Data - URL parameters: page (default: 1), limit (default: 50) - Key response fields Bubble will detect: id, user_id, user_email, course_id, percentage_completed, completed_at, activated_at, is_free_trial, updated_at GetUser call (look up a specific student): - Call name: GetUser - Method: GET - URL: https://api.thinkific.com/api/v1/users/[user_id] - Use as: Data - Add a path parameter placeholder: in the URL, type the literal brackets [user_id] — Bubble treats bracketed terms as dynamic parameters - Key response fields: id, first_name, last_name, email, created_at GetOrders call: - Call name: GetOrders - Method: GET - URL: https://api.thinkific.com/api/v1/orders - Use as: Data - URL parameters: page (default: 1), limit (default: 50) - Key response fields: id, user_id, amount_cents, status, created_at For the GetEnrollments call, run Initialize call with a real request. The enrollments endpoint returns all enrollments across all courses — filter to a specific student in Bubble workflows using the user_email or user_id field. Important notes on the price field: Thinkific stores all prices as integers in cents. A price of 9900 means $99.00, not $9,900. In Bubble, you will always need to divide this value by 100 before displaying it. The cleanest way: in your Repeating Group text element, set the value to Thinkific GetCourses's items price / 100 using Bubble's arithmetic expression builder. Free courses return a price value of 0, not null or empty — use = 0 (not is empty) in conditionals to detect free courses.

1{
2  "calls": [
3    {
4      "name": "GetEnrollments",
5      "method": "GET",
6      "url": "https://api.thinkific.com/api/v1/enrollments",
7      "use_as": "Data",
8      "params": { "page": "1", "limit": "50" }
9    },
10    {
11      "name": "GetUser",
12      "method": "GET",
13      "url": "https://api.thinkific.com/api/v1/users/[user_id]",
14      "use_as": "Data",
15      "dynamic_params": ["user_id"]
16    },
17    {
18      "name": "GetOrders",
19      "method": "GET",
20      "url": "https://api.thinkific.com/api/v1/orders",
21      "use_as": "Data",
22      "params": { "page": "1", "limit": "50" }
23    }
24  ]
25}

Now wire the API data to your Bubble UI. Open a page in the Bubble editor where you want to display the course catalog. Add a Repeating Group element: - Right-click the canvas → Add element → Repeating Group - In the property panel, set Type of content to Thinkific GetCourses's items (Bubble created this type automatically when you initialized the call) - Set Data source to Get data from external API → choose Thinkific - GetCourses - Set the page parameter to 1 and limit to 50 in the API call dialog - Choose List layout (rows or columns depending on your design) Inside the Repeating Group, add elements for each course: Course name (Text element): set value to Current cell's items's name Price display — this is where the cents-to-dollars conversion lives: - Add a Text element - Open the dynamic data editor - Set value to: Current cell's items's price / 100 (use Bubble's arithmetic expression: value :formatted as number with decimal places: 2) - Add a Condition: when Current cell's items's price = 0 → text content changes to 'Free' Progress bar (for enrolled student views): add a Shape element set to a progress bar style with width = (Current cell's items's percentage_completed / 100) × full bar width pixels Enroll button: add a Button element. In the workflow for When Button is clicked, add a step: Schedule API workflow → EnrollStudent (you'll build this in Step 6). Pass the current course ID as a parameter. Pagination: add a 'Load More' button below the Repeating Group. Create a custom state on the page called current_page (Number, default: 1). When Load More is clicked, set current_page = current_page + 1. In the Repeating Group's data source, change the page parameter from the hardcoded 1 to current_page state value. This implements Thinkific's page-based pagination. To show whether the next page exists, add a condition on the Load More button: visible only when Thinkific GetCourses's meta's next_page is not empty.

Programmatic enrollment is the most powerful capability of the Thinkific integration. Instead of manually enrolling students in Thinkific's dashboard, a Bubble Backend Workflow handles it server-side — keeping your API key private and enabling enrollment from any Bubble trigger (button click, payment confirmation, form submission, etc.). Note: Backend Workflows require Bubble's Starter plan ($32/mo) or higher. On the Free plan, this step is not available. To create the Backend Workflow, go to your Bubble editor → click the tab icon in the left sidebar → select Backend workflows. Click Add new API workflow. Configure the workflow: - Name: EnrollStudent - Expose as public endpoint: yes (this allows front-end workflows to schedule it) - Parameters: add two parameters: - user_email (text type) - course_id (number type) Add the first workflow step: click Add step → Plugins → Thinkific - EnrollStudent (API Connector call). First, you need a separate POST API call for enrollment. Go back to the Plugins → API Connector → Thinkific group and add: - Call name: CreateEnrollment - Method: POST - URL: https://api.thinkific.com/api/v1/enrollments - Use as: Action - Body (JSON): set content type to JSON - Body content: { "course_id": <course_id>, "user_email": "<user_email>" } - Mark both body parameters as dynamic (using angle-bracket placeholders) Back in the Backend Workflow, the first step calls CreateEnrollment with course_id = Step's course_id parameter and user_email = Step's user_email parameter. Add a second step to record the enrollment in Bubble's own database: Create a new Thing → select your Enrollment data type (create it in Data tab if needed with fields: user_email text, course_id number, enrolled_at date, source text). Set source to 'thinkific'. Set up Privacy rules for the Enrollment data type: Data tab → Privacy → click Enrollment → Add a rule → 'Creator is Current User' — this ensures each user can only read their own enrollment records, not all students' records. To trigger the Backend Workflow from a front-end button: in the button's workflow, add the step Schedule API workflow → EnrollStudent → pass the current user's email and the selected course ID as parameters. RapidDev's team has built hundreds of Bubble apps with integrations like this — if your enrollment flow needs advanced logic like payment gating or multi-course bundles, book a free scoping call at rapidevelopers.com/contact.

1{
2  "call_name": "CreateEnrollment",
3  "method": "POST",
4  "url": "https://api.thinkific.com/api/v1/enrollments",
5  "use_as": "Action",
6  "content_type": "application/json",
7  "body": {
8    "course_id": "<course_id>",
9    "user_email": "<user_email>"
10  }
11}