Tutorial

How to Build a Webflow CMS Job Board With Application Forms and Multi-Filter Tags in 2026

Written by
Pravin Kumar
Published on
Jun 16, 2026

Why a Solo Hiring Agency in Bengaluru Asked Me for a Job Board Last Month

A founder I have worked with for two years runs a recruiting agency that places product designers and engineers into Indian startups. In May 2026 she sent me a message asking whether her Webflow site could host a small job board with five to twenty active listings, multi-tag filtering by city and seniority, and application forms that landed in her Slack with attached CVs. Her quoted alternative was a Greenhouse plan at USD 250 per month plus an embed widget that broke her brand. The Webflow build I delivered cost her INR 24,000 once and runs forever on her existing CMS plan.

This kind of build is one of the highest leverage tutorials I can share, because Webflow's Q2 2026 CMS API update increased item limits from 10,000 to 20,000 per collection on the CMS plan, which makes job boards inside Webflow viable for agencies up to about 200 active listings. I want to walk through the exact build with every collection, every field, and the Slack routing.

I will cover what the collections need to look like, how to build the multi-filter tag bar, how to wire application forms with file upload, the Slack routing trick that avoids paid Zapier, and how to handle expired listings without manual cleanup.

What Are the Collections You Need to Set Up First?

You need three collections. Jobs, Job Categories, and Locations. Job Categories holds seniority and function tags. Locations holds city and remote-friendly flags. Jobs references both as multi-reference fields. This three-collection model is the smallest workable schema that supports multi-filter tag bars without forcing a rebuild in six months.

The Jobs collection needs ten fields. Name, slug, role description as RichText, salary range as PlainText, application deadline as DateTime, application URL or form toggle as Switch, status as Option with Live and Filled, categories as MultiReference, locations as MultiReference, and hiring company logo as Image. The slug pattern should follow company-role-2026 to keep URLs readable.

Job Categories holds two fields beyond Name and Slug. Type as Option with seniority or function, and colour token as Option matching your design system. The colour token field is what lets the tag chips render in different colours per category type without per-item styling. Locations holds Name, Slug, Type as Option with city or remote, and a state field for India-specific filtering.

How Do You Build the Multi-Filter Tag Bar?

Use the Finsweet CMS Filter Beta released in March 2026, which supports multi-select tags out of the box and does not require custom code. The setup takes about thirty minutes once you understand the attribute pairs. The filter bar itself is a Webflow CMS list of Job Categories rendered as buttons, with the fs-cmsfilter-element attribute set on each button.

The job list below the filter bar is a standard CMS Collection list bound to the Jobs collection with sort by Application Deadline ascending. The Finsweet attribute fs-cmsfilter-element is set to list on the wrapper, and fs-cmsfilter-field is set to category-name on each list item's category tag block. The result is a multi-select tag bar that filters the list with no full page reload and shareable URL state.

For the city filter, repeat the same pattern with Locations as the source collection. Stack the two filter sets in the same fs-cmsfilter-element wrapper so they combine with AND logic. If you want OR logic across the same field, set fs-cmsfilter-logic to or on the wrapper. The whole filter setup runs without any third-party tool fees, because Finsweet's CMS Filter is free for Webflow Designer plans.

How Do You Wire the Application Form With File Upload?

Use a Webflow native form with a file upload field and route the submission through Webflow's built-in webhooks. The native file upload supports up to 10 MB per file as of the May 2026 platform update, which covers CVs in PDF and DOCX format without any external uploader. Set the form to redirect to a thank-you page after submission so the candidate sees confirmation.

Place the form on the Job detail page template so each application captures the Job Name and Job Slug as hidden fields. Hidden fields pull from CMS bindings using Webflow's reference field syntax, which is the simplest way to attach context without writing a single line of JavaScript. The form action stays as the default Webflow handler, which is the path the webhook listens to.

For the receiving end, set up a Webflow webhook on form_submission filtered by form name. Point the webhook at a Make.com scenario or a Cloudflare Worker that posts to Slack. I prefer the Worker because it costs zero on Cloudflare's free tier for any volume my clients will see. The Worker code is 40 lines, posts to Slack incoming webhooks, and attaches the uploaded CV as a link rather than a re-upload.

How Do You Route Submissions to Slack Without Paying for Zapier?

The Cloudflare Worker pattern is the cleanest path. Webflow fires a webhook on every form submission. The Worker receives the POST, parses the JSON, formats a Slack message, and forwards it via the agency's Slack incoming webhook URL. Total cost is zero up to 100,000 requests per day on Cloudflare's free tier, which covers any job board volume.

The Worker code parses the submission for Job Name, Job Slug, candidate email, and CV URL. It posts a Slack block kit message with a clear header, the role name, the candidate email as a clickable mailto link, and a download link to the CV. The hiring agency I built this for receives roughly 40 applications per week. Slack messages arrive within four seconds of submission on average, which is good enough for the agency's response SLA.

How Do You Handle Expired Job Listings Without Manual Cleanup?

Use a Webflow scheduled rule via the Webflow MCP Server and a Cloudflare Worker cron trigger to auto-archive any Job item where the Application Deadline field is more than seven days in the past. The MCP server can update collection items via the unpublish action without requiring Designer access, and the Worker cron runs once a day for free.

The exact pattern I use is a Worker cron that runs at 02:00 IST, queries the Webflow Jobs collection through the MCP server for items with status Live and deadline before yesterday, and updates each item to status Filled with isArchived true. The hiring agency runs this without ever touching the CMS for cleanup. In June 2026 the rule processed 73 expired listings without an error.

How Do You Handle Pagination if the Board Grows Beyond 100 Listings?

Use Finsweet's CMS Load attribute paired with the existing CMS Filter setup. CMS Load handles up to 1,000 items per visible page on the published site, which is more than enough headroom for a recruiting agency. The combination of CMS Filter and CMS Load works without conflicts because both attributes target the same wrapper and read from the same DOM.

For the agency I built this for, I capped the visible page at 25 listings with a Load More button. The button label updates with the remaining count so candidates know how many jobs are left to browse. For the broader pattern on combining filter and pagination, my walkthrough of CMS pagination and filtering for 100-plus item lists covers the edge cases. For the design choices on how the filter bar looks and feels, my piece on CMS filter chip bar design covers the visual decisions that affect mobile usability.

What Should You Test Before Handing This Off to the Client?

Test eight things. Multi-select filter behaviour, mobile filter bar layout, shareable URL state across refresh, file upload size limits, Slack message formatting for each role type, the cron archive job, the expired listing fallback display, and a duplicate-submission guard. Each of these has bitten me at least once on a previous job board build, which is why the list reads like a checklist.

The duplicate-submission guard is the one most builders skip. A candidate refreshing the thank-you page can sometimes re-fire the form if you bind the redirect to a URL parameter. I avoid this by redirecting to a hardcoded thank-you page that does not include any form state. That single change cut the agency's duplicate submission rate from about 6% to under 1% over the first month.

How to Launch Your Webflow Job Board This Week

Build the three collections on day one, wire the filter bar and the application form on day two, set up the Cloudflare Worker for Slack routing on day three, and run the cron archive trial on day four. By the end of the week you have a board you can hand to a hiring partner. If you want help structuring the collections for a use case beyond a simple recruiting agency, like a freelance marketplace or a remote-only board, I am happy to walk through it. Let's chat.

Get your website crafted professionally

Let's create a stunning website that drive great results for your business

Contact

Get in Touch

This form help clarify important questions in advance.
Please be as precise as possible as it will save our time.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.