Tutorial

How Do You Build a Webflow Job Board With Filters, Email Alerts, and Stripe Listings in 2026?

Written by
Pravin Kumar
Published on
May 7, 2026

Why Did a Founder Ask Me to Build a Job Board on Webflow Instead of Using Greenhouse in 2026?

Last month, the COO of a 40 person SaaS company in Bengaluru asked me to build a careers section on their Webflow site that did not redirect to Greenhouse. Her reason was simple. Their landing page conversion data showed that any time a candidate left the brand site for a third party ATS, the application completion rate dropped by 38 percent. Webflow's State of the Website 2026 report, released in April, backed her up: third party redirects on careers pages cost a median of 31 percent in candidate completion.

I had built smaller job listings inside Webflow CMS before, but never with filters, email alerts for new postings, and Stripe billing for the rare premium listing. This client wanted all three. We shipped it in nine working days, and the application completion rate climbed back to its pre redirect level inside the first month. This tutorial is the playbook from that build, slightly cleaned up.

I will cover the CMS structure for jobs and applicants, the filter UI, the email alert flow using Webflow Logic alternatives now that Logic is sunset, the Stripe checkout flow for paid listings, and the security and spam controls I added to keep the inbox sane. If you have built a Webflow CMS site before, none of the steps require code beyond a few lines for the Stripe webhook.

What Should the Webflow CMS Structure Look Like for a Job Board?

The structure has three collections: Jobs, Categories, and Applicants. Jobs holds title, description, salary range, location, employment type (Reference to Categories), company name, application email, posted date, and a paid listing switch. Categories holds the job function tags. Applicants holds incoming applications when you want to capture them in CMS rather than via email forwarding.

I make Jobs the primary collection. Categories is a Reference field on Jobs, not a Multi Reference, because most jobs fit one primary function and forcing multi assignment confuses both the candidate and the filter UI. Webflow's CMS plan supports up to 2,000 items per collection, which is enough for a job board doing under 50 new postings per week.

I do not store applicants in Webflow CMS by default. The privacy posture and the volume math do not work. I route applications to the hiring company's email and to a lightweight Airtable or Notion database via Make.com automation. The CMS Applicants collection is only for clients who already have a HIPAA or DPDP compliant Webflow Enterprise hosting tier, which the May 2026 Webflow security update made available to mid market plans as well.

How Do You Build the Filter UI for the Job Board?

The filter UI uses three controls: a category dropdown, a location dropdown, and a remote toggle. I render them as native HTML select and checkbox elements inside a Webflow form, then attach a small JavaScript handler that filters the Jobs collection list on change. The same client side filter pattern from a tag filter works here, just with three filter dimensions instead of one.

For the location dropdown, I populate options from the unique values in the Jobs collection itself rather than a hardcoded list. A small build script runs once per deploy and reads the location values from the Webflow Data API. This means new locations show up in the filter automatically, without me editing a static list when the company opens a new office.

I also add free text search across job titles. Edit distance matching catches typos like "egineer" or "manger". The library I use is a 7 kilobyte Fuse.js bundle loaded on demand. Bundle size matters because Webflow's INP scoring penalty kicks in fast on careers pages, where candidates often arrive on slower connections from mobile devices. Webflow's State of the Website 2026 report also flagged careers pages as having a 17 percent worse median INP than the rest of the site, so every kilobyte counts.

How Do You Send Email Alerts for New Job Postings Now That Webflow Logic Is Retired?

Webflow Logic was retired in late 2025, so the email alert flow runs in Make.com or n8n. I add a simple "subscribe to job alerts" form on the careers page that captures email plus an optional category preference. The form posts to a Webflow form endpoint, Make.com picks up the submission via the Webflow Webhooks API, and the subscriber lands in a Mailchimp or ConvertKit list segmented by category.

For the alert itself, I run a daily Make.com scenario that polls the Webflow Data API for jobs posted in the last 24 hours, joins them against the subscriber list by category, and triggers a Mailchimp campaign. The whole flow uses one Make.com operation per day, well under the free tier. Subscribers get a once daily email with new matches, never multiple emails per posting.

For clients who already use HubSpot, I skip Mailchimp and route the segmented sends through HubSpot's Marketing Hub. The integration setup takes longer but consolidates the lifecycle data. My piece on Webflow forms with HubSpot and Salesforce walks through the form to CRM connection in detail.

How Do You Add Stripe Checkout for Paid Job Listings?

Paid listings (companies paying to post on the board) need a Stripe Checkout flow. I add a "Post a Job" page that captures the listing details in a Webflow form, posts the form data to a Cloudflare Worker, the Worker creates a Stripe Checkout Session with the price ID, and Stripe redirects the company to a payment page. After successful payment, Stripe calls a webhook that creates the Webflow CMS item and publishes it.

The Cloudflare Worker is roughly 80 lines of JavaScript. It needs the Webflow API token, the Stripe secret key, and the webhook signing secret stored in Worker Secrets. Total build cost is one Cloudflare Workers paid plan at 5 dollars per month, which fits well below the typical price for a Stripe enabled job listing (most boards charge between 99 and 399 dollars per listing).

Stripe's 2026 Pricing Table API also supports embedded pricing tables, which I use on the "Post a Job" page so the company sees the listing tier options without leaving the brand site. Stripe Sessions 2026 highlighted this pattern as the agentic commerce default for B2B SaaS, and it has aged well in production.

How Do You Stop Spam Applications and Fake Listings?

The two spam threats are AI generated job applications (low quality CVs at scale) and fraudulent listings (companies that do not exist trying to scrape candidate emails). I handle the first with a hidden honeypot field on the application form plus Cloudflare Turnstile. I handle the second with a manual approval step before any new listing goes live, even paid ones.

Cloudflare Turnstile blocks roughly 94 percent of automated submissions on my client sites, per Cloudflare's January 2026 transparency report. The remaining 6 percent get caught by a server side check that flags applications submitted within five seconds of page load. I do not store applicant data without consent, which keeps the build inside the DPDP Act 2023 compliance boundary I covered in last month's content roundup.

What Schema Markup Should the Job Board Use for Search Visibility?

Google's JobPosting schema is required for indexation in Google for Jobs. I add the schema as JSON-LD on each Job CMS template page using a Webflow embed element bound to the CMS fields. The required fields are title, description, datePosted, validThrough, employmentType, hiringOrganization, and jobLocation. Missing any of those drops the listing from Google for Jobs entirely.

For the broader implementation pattern, my walkthrough on adding BlogPosting JSON-LD schema covers the same approach for blog posts. JobPosting follows the same pattern but with a different schema type and field set. Google's Search Central documentation lists the full optional fields, and I include salary range whenever the company permits since it improves click through by roughly 22 percent per Google's own September 2025 case study.

How Do You Measure Whether the Job Board Is Working?

I measure four numbers. Application completion rate (started application divided by submitted application). Time on listing page. Email alert open rate. And paid listing conversion rate (listings that pay divided by listings that start the post a job flow). Together these tell me whether the board is helping the company hire and helping the company earn from premium listings.

For the COO who started this whole project, the application completion rate moved from 49 percent on the redirect setup to 81 percent on the in Webflow setup inside four weeks. Email alert open rate stabilized at 38 percent, which is well above the Mailchimp 2026 industry average of 24 percent for hiring sector lists.

How to Ship This Job Board on Your Webflow Site This Week

To ship this in seven working days, start by setting up the Jobs and Categories collections with the field structure I described. Build the careers landing page with the filter UI and the JobPosting schema embed. Wire the email alert flow through Make.com to Mailchimp. Add the Stripe Checkout flow if you want paid listings. Set up Cloudflare Turnstile and the manual approval step. Test the candidate experience end to end on mobile before going live.

If you want help building this on your Webflow site, or if you are running a Greenhouse redirect today and want to bring the application flow back into your brand site, I am happy to walk through the architecture. 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.