How can I add requirement tags to a job board created in Webflow using CMS Collections and linking them to the main CMS Collection for jobs?
TL;DR
- Create a separate Requirements CMS Collection with relevant fields.
- Add a multi-reference field in the Jobs Collection linking to Requirements.
- Assign requirements to each job item via the multi-reference field.
- Display them on the Job Template Page using a Collection List.
- Use Jetboost or Finsweet Attributes to enable filtering by requirements.
To add requirement tags (e.g., skills, experience, qualifications) to a job board in Webflow and link them to your main CMS Collection for Jobs, you’ll need to create a multi-reference relationship between two CMS Collections.
1. Create a Requirements CMS Collection
- Go to the CMS panel, click + New Collection, and name it something like "Requirements" or "Skills".
- Add a single field for the Name of the requirement (e.g., HTML, Communication, 3 years of experience).
- Add any other optional fields (e.g., icon, description) if needed.
2. Add a Multi-reference Field to the Jobs Collection
- Go to your "Jobs" CMS Collection and click Settings (gear icon).
- Click + Add Field, choose Multi-reference, and select the Requirements Collection you just created.
- Name the field something like "Job Requirements".
- Save the Collection and click Save Collection Structure.
3. Input Requirement Relationships per Job
- Open each Job item in the CMS and use the multi-reference field to select related Requirement tags.
- You can select multiple requirements per job.
4. Display Requirements on the Job Template Page
- Go to the Job Template Page in your project’s Pages panel.
- Drag a Collection List element onto the canvas.
- In the settings panel, choose the Job Requirements multi-reference field as the source.
- Inside this Collection List, add a Text Block or Text Link and connect it to the Name field of each requirement.
- Style as needed (e.g., as tags or badges).
5. Optional: Enable Filtering by Requirements (with Jetboost or Finsweet Attributes)
- Webflow does not support native filtering by multi-reference fields.
- Use third-party tools like:
- Jetboost CMS Filters: Enables live filtering of CMS lists using checkboxes, tags, etc.
- Finsweet’s CMS Filter: A free solution using Attributes (https://www.finsweet.com/attributes/cms-filter).
To enable filter-by-requirement functionality:
- Install the filtering tool.
- Configure each item to output requirement tags as filterable values.
- Apply filters based on user interaction (e.g., “Show all jobs that include ‘JavaScript’”).
Summary
To add and link requirement tags to jobs in Webflow:
- Create a separate Requirements CMS Collection.
- Link it to Jobs via a multi-reference field.
- Display using a Collection List on the Job Template Page.
- Use tools like Jetboost or Finsweet Attributes for advanced filtering.