Workable

A careers page built as static Webflow pages goes stale the moment hiring changes. Someone has to edit and republish every time a role opens or closes, and there is no built-in way to screen applicants or move them through interview stages. Teams that hire through Workable end up maintaining job content in two places and copying candidate details by hand.

Be clear about what this connection is. Workable is an applicant tracking system, not a Webflow app, and there is no one-click connector between the two. The work is real integration work: embedding a job widget, wiring an automation platform between the products, or calling both REST APIs from a server. Since 2026 there is also an MCP server on each side, which lets an AI assistant read jobs out of Workable and write them into Webflow without a build.

This suits recruiters and HR ops teams who own hiring, plus the marketers and Webflow agencies who own the careers page. A startup hiring its first ten people can launch with the copy-paste widget. A company running dozens of open roles can build a CMS-backed careers site with applications submitted on its own domain.

How to integrate Workable with Webflow

What is Workable? Workable is an applicant tracking system for recruiting and hiring. It posts jobs to external job boards and carries candidates through pipeline stages to offer. For integrations it exposes a REST API, webhooks, a JavaScript job widget that embeds open roles on external sites, and an MCP server for AI assistants.

This integration brings those published roles onto a Webflow site and routes applicants back into Workable.

Teams pair the two when the marketing site runs on Webflow and hiring runs in Workable. The connection keeps job listings current without manual republishing and sends every applicant into the right pipeline. How far you take it depends on whether you need listings only or applications on your own domain as well.

Five approaches are available, and none of them is a one-click app:

• MCP servers on both sides: Workable and Webflow each publish an MCP server, so an AI assistant with both connected can pull open roles and create the matching CMS items on request.
• Links to the hosted careers page: Visitors go to your apply.workable.com page, which is the no-integration baseline and needs zero setup on either side.
• The Workable job widget: A copy-paste script lists your published roles inside a Code Embed element, with no code of your own to write.
• Zapier: Webflow form submissions and Workable candidate events connect through a hosted automation, with no server for you to run.
• The Webflow Data API and Workable API: Full control over CMS job sync and candidate creation, at the cost of server-side development.

These combine well. Widget listings paired with a Zapier-routed application form is a common starting point.

Connect Workable and Webflow through MCP servers

Both products ship an MCP server, so an AI assistant can read your Workable pipeline and write Webflow content in the same conversation. The Workable MCP server runs at https://mcp.workable.com/mcp, authenticates over OAuth2 with your existing Workable login, and exposes tools across jobs, candidates, offers, requisitions, and employee records. Workable includes it on every plan at no extra cost. What the assistant can do is bounded by your own Workable permissions: it cannot read or change anything your user account is not already authorized for.

To set this up:

1. In an MCP-capable client, add https://mcp.workable.com/mcp as a custom connector and sign in when the OAuth prompt appears.
2. Add Webflow's MCP server alongside it and authorize the workspace holding your careers site.
3. Ask the assistant to list published roles in Workable and create or update the matching items in your jobs collection.

The honest limit is that this is request-driven, not a background sync. Nothing runs once you close the chat, so a careers page that has to stay current on its own still needs the scheduled polling described further down. We find MCP earns its place for the first bulk load and for one-off cleanups, not as the sync itself.

Link to your Workable-hosted careers page

Every Workable account includes a hosted careers page at apply.workable.com/[subdomain], built in Workable's careers page site builder. Linking to it from Webflow needs no custom code and works on any Webflow plan, including free Starter.

To set up the link-out:

1. In Workable, open the Careers Page settings under your user icon and build the page in the site builder.
2. Add your branding and content. The header, footer, and list of jobs are required sections.
3. In Webflow, point a nav link or button to apply.workable.com/[your-subdomain] and publish the site.

The hosted page includes a job search bar, but it appears only once you have 6 published jobs. The trade-off is that candidates leave your domain to browse and apply. To keep listings on your own pages, use the job widget instead.

Add the Workable job widget with a Code Embed element

The job widget is a short script you copy from Workable and paste into your careers page, where it lists your published roles and picks up your site's styling. Workable's careers page comparison names Webflow as a compatible platform, and the widget is available on all Workable plans. On the Webflow side, Code Embed requires a paid Site plan or a paid Workspace plan. The free Starter Site plan does not include custom code.

To set up the widget:

1. In Workable, click the settings icon, then go to Settings > Integrations > Apps. Only Super Admins can access this section.
2. Select Company website under Service Integrations, choose whether to group jobs by location or department, and copy the generated code.
3. In Webflow, open the Add panel, drag a Code Embed element onto your careers page, and paste the code.
4. Click Save, then publish the site. Custom code renders in preview, but it only goes live after you publish.

Once it is on the page, the widget looks after itself:

• Styling: It inherits your site's CSS, so fonts and colors match the rest of your design without extra work.
• Overrides: It accepts targeted rules in a <style> tag placed immediately before the widget script.
• Updates: Listings change whenever you publish or remove a job in Workable, with no code change on the Webflow side.
• Empty state: It renders <p class="whr-empty-text">No positions available</p> when nothing is open, which you can restyle to match the page.

Two limits apply. The search and filter bar from the hosted careers page is not included, and Workable states "you will have to create this on your own." Never place <html>, <body>, or <head> tags inside a Code Embed element either, because they break the page layout. Use the widget to display jobs, and Zapier or the APIs to capture applicants on your own domain.

Connect Webflow and Workable with Zapier

Zapier links form events on your site to your candidate pipeline without any server code. It is the automation platform listed in Workable's partner directory, and Zapier's Workable integration covers both directions. You need accounts on both platforms and authorized connections to Webflow and Workable inside Zapier.

These pairings cover most careers-page automations:

• Applicant to candidate: A Webflow form submission triggers Create Candidate or Find or Create Candidate, so the applicant lands in the right job pipeline.
• Pipeline moves: The same trigger can fire Move Candidate Stage, which puts applicants from your site at the correct point in the process.
• Tagging and notes: Add Tag to Candidate and Add Comment Candidate annotate the record with the source, which is how recruiters see what your site produced.
• Reverse direction: New Candidate, New Disqualified Candidate, and Updated Candidate Stage in Workable can create or update Webflow CMS items for internal dashboards.

Zapier's Workable triggers cover candidate events only. Nothing fires when a job is published, so keeping CMS listings in sync belongs to the API path below.

Build with the Webflow and Workable APIs

The API path lets developers sync jobs and route applications while controlling exactly what candidate data reaches Workable. It requires a server or serverless function. Workable does not support Cross-Origin Resource Sharing, so browser-direct calls are blocked and every authenticated request has to go through your own backend. API access tokens are available on all Workable plans and are generated by an Admin under Settings > Integrations > Apps.

The integration draws on these interfaces:

• Workable API: The Workable API handles jobs, candidates, application forms, and webhook subscriptions at https://{subdomain}.workable.com/spi/v3.
• Webflow Data API: Webflow's Data API handles CMS collections and form submissions at https://api.webflow.com/v2.
• Webflow webhooks: Webflow webhooks push real-time events, including form submissions, to any endpoint you own.
• Workable public endpoints: Unauthenticated requests to https://www.workable.com/api/accounts/{subdomain} return job data with location and department metadata, and they work from the browser with no token.

Together these support the two core workflows: syncing jobs into the CMS and routing applicants back into Workable.

Sync Workable jobs into the Webflow CMS

Job sync runs on scheduled polling, because Workable fires no webhook when a job is published or updated. The supported webhook events include job_deleted as the only job lifecycle event. Each Workable job becomes an item in the Webflow CMS with its own designed page and a unique, crawlable URL.

To build the sync:

1. Generate a Workable access token with the r_jobs scope. Copy it immediately; it is not visible after the modal closes. A token used to create a webhook subscription also needs r_candidates or r_employees.
2. For the initial sync, paginate through GET https://{subdomain}.workable.com/spi/v3/jobs?state=published with an Authorization: Bearer header. For incremental syncs, poll with updated_after and without a state filter, so you can detect published, closed, and archived alike. Use include_fields to pull description, requirements, and benefits. The jobs endpoint returns up to 100 jobs per page.
3. List the existing Webflow collection items and match them by Workable shortcode. Store the shortcode in each item and persist its Webflow item ID: candidate routing depends on the shortcode, while updates depend on the item ID. Create only new jobs with POST https://api.webflow.com/v2/collections/{collection_id}/items/live (scope cms:write), which publishes items immediately. Update existing live items with PATCH /v2/collections/{collection_id}/items/live instead of creating duplicates.
4. When polling returns a job in the closed or archived state, unpublish its matching item with DELETE /v2/collections/{collection_id}/items/live. Periodically reconcile all currently published Workable shortcodes against live CMS items and unpublish any item whose shortcode has dropped out of the published set.
5. Use a token with r_candidates or r_employees to subscribe to job_deleted via POST /spi/v3/subscriptions as an additional deletion signal, then unpublish the matching item.

Design a job template page for the collection and bind the synced fields to it, then list open roles on your careers page with a Collection List. These pages render as standard server-side HTML, so search engines crawl them on your own domain rather than inside an iframe hosted elsewhere.

Route Webflow form submissions to Workable candidates

A Webflow-native application form can create candidates directly in the right job pipeline. The flow runs from form submission to Webflow webhook to your server to Workable's candidates endpoint. Browser-direct posts to Workable are blocked, so the server hop is mandatory.

To implement the routing:

1. Register a webhook with POST https://api.webflow.com/v2/sites/{site_id}/webhooks (scope sites:write) and pass "triggerType": "form_submission" and your endpoint URL. An optional filter parameter targets one named form, and the webhook events reference documents the payload shape.
2. In your endpoint, map the payload's data fields to Workable candidate fields such as firstname, lastname, email, phone, and cover_letter.
3. Send POST https://{subdomain}.workable.com/spi/v3/jobs/{shortcode}/candidates with the w_candidates scope. The candidate creation endpoint requires name (or firstname plus lastname) and email. Set "sourced": false to trigger the thank you for applying email.

Build the endpoint to be idempotent so it handles repeat or duplicate deliveries safely.

What you can build with the Workable Webflow integration

Integrating Workable with Webflow lets you run hiring from your own domain instead of sending every candidate to a separate hosted careers site.

• Branded careers page with live listings: Embed the job widget on a designed careers page, where listings appear and disappear as recruiters publish or close roles. ClickMechanic embedded the widget on its own site: "Job specs, complete with our own branding and logo, now load automatically from Workable onto our site." The company recruited eight new employees in its first three months.
• SEO-ready job pages in the CMS: Sync roles into a CMS collection so each job gets its own URL, then add JobPosting structured data, which Google recommends placing on the most specific page describing a single job.
• On-domain application forms: Build a Webflow-designed application form that posts candidates into the correct pipeline via the job shortcode, and tag arrivals webflow-applicant so recruiters can see the source in Workable.
• Zero-code careers launch: Point your site's careers nav at your hosted page. Writesonic runs this pattern: its careers page lists openings that resolve to apply.workable.com/writesonic/.

If you want tighter control over field mapping or application routing, start on the API path and learn the CMS API first. To drive any of this from an AI assistant instead, connect our MCP server and point it at your jobs collection.