How can I implement a multi-select field with a pre-selected option in a popup form on a collection page using Webflow?

To implement a multi-select field with a pre-selected option in a popup form on a collection page using Webflow, you'll need to use custom code and a bit of JavaScript. Here's a step-by-step guide on how to do it:

1. Design your popup form:
- Create a popup element that will trigger the form.
- Add form elements to the popup, including the multi-select field.
- Give each form element a unique class or ID for easier targeting.

2. Set up your collection and collection template:
- Create a collection and add the necessary fields, including the field for the multi-select options.
- Design the collection template to include the popup trigger element and the form.

3. Add the custom code:
- Insert an embed element in the collection template where the form is located.
- Choose the option to embed custom code.
- In the custom code block, write JavaScript code to populate and pre-select the multi-select field with the desired option(s) based on the collection data. Here's an example:

```javascript

```

Make sure to replace `"Option 1", "Option 3"` with the actual values of the options you want to pre-select, and `"#multi-select-field"` with the correct class or ID of your multi-select field element.

4. Preview and test:
- Save your changes and preview the collection page.
- Test the popup form and verify that the pre-selected options are correctly displayed in the multi-select field.

By following these steps, you should be able to implement a multi-select field with a pre-selected option in a popup form on a collection page using Webflow. Remember to adjust the code and element selectors based on your specific setup.