How can I create a form in Webflow with information from my CMS, and set unique names for all the fields to avoid issues with checkboxes displaying incorrectly and receiving random field numbers in emails?

To create a Webflow form that pulls data from the CMS and ensure unique field names to avoid checkbox issues and random number fields in email notifications, follow these steps:

1. Understand the Core Issue

• Webflow automatically assigns generic field names (like Checkbox 2) if you don’t manually set them.
• When fields have the same generic name or are left blank, Webflow's form handler can throw off your email formatting or render checkboxes unpredictably.
• Dynamically populating a form via the CMS must be configured so each field name is manually set and unique, especially if the form is generated inside a Collection List.

2. Build the CMS-Driven Form

• Add a Collection List to the page and bind it to your desired CMS Collection.
• Inside the Collection List, insert form elements that relate to the CMS data (e.g., checkboxes, radio buttons, hidden fields).
• Use Custom Attributes and Names for each dynamic form field.

3. Set Unique Field Names via Dynamic Text

• Go to each field (e.g., Checkbox, Text Field) and manually set the Field Name under the Element Settings panel.
• Use dynamic CMS values to set names. For example:
• Checkbox name: course-{{wf {"path":"slug","type":"PlainText"\} }} will output something like course-web-design.
• Tip: In Webflow's designer, you can’t directly bind dynamic data to field names, but you can simulate this using custom code embeds or JavaScript (see next step).

4. Customize Field Names Using Embed Code (Advanced)

If you need fully dynamic field names or IDs (e.g., within a loop), add an Embed component inside your Collection List and use code like:

<input type="checkbox" name="course-{{wf {&quot;path&quot;:&quot;slug&quot;} }}" value="{{wf {&quot;path&quot;:&quot;name&quot;} }}">

• Replace slug and name with the appropriate CMS fields.
• This ensures that each checkbox has a unique and readable name.

5. Finalize Form Structure and Avoid Nesting Errors

• Ensure that the entire form is outside or wraps around the Collection List, not the other way around.
• Webflow does not allow multiple form tags inside a Collection List, so structure it like:
• One form → inside it, the Collection List → form fields within Collection Items.

6. Test Form Email Formatting

• Go to Project Settings > Forms, send a test submission, and confirm proper field labels.
• Avoid seeing [Checkbox 3] or [Checkbox X] by having all names properly set and unique.

Summary

To use dynamic CMS data with a form and avoid checkbox naming issues in Webflow, manually assign unique field names using CMS values via custom embeds or attributes. Ensure your form structure is valid (no nested <form>), and test email output to confirm that field data is clear and accurately labeled.