CMS Select

Scroll horizontally to see documentation

Step #2

Implement in Webflow

Apply attributes to elements on the page

Below is a list of elements and options that are used to create this Attributes functionality. Click any of them to see more details.

TEXT VALUE

I want this

Text Element

inside a Collection List Item to be the dynamic content for the Select Field

See how it works

Add this attribute

Description

Name

fs-cmsselect-element

Value

text-value

Check live example here

This text is the source for the Select Field value. Select values will be dynamically generated based on the this element.

For example, if there are 10 items in this Collection, the Select will generate 10 options and each option value will be this "text-value" element.

This List will automatically be removed from the page once its content is added to the select field. It is only used to get the dynamic data. It is not for display purposes.

SELECT

I want this

Select Field

to display the dynamic content

See how it works

Add this attribute

Description

Name

fs-cmsselect-element

Value

select

This is the dynamic Select Field on the page.

Each Collection Item from the List will be added as a new option in the Select Field.

I want to have more than one instance of CMS Select on the same page

See how it works

Optional

This element is optional to add

You may need multiple instances of this Attribute!
All of our attributes follow the same structure for multiple instances!
‍
To use a second, third, or fourth instance on an attribute add -x at the end of the value of the element attribute. "x" must be a unique number. This unique number is how you link elements to instances. For example, list-3, trigger-3, and target-3 will all be connected to the same instance.

Example of this solution:

Attributes that must have instances

Second instance example

Third instance example

fs-cmsselect-element = "text-value"

fs-cmsselect-element = "text-value-2"

fs-cmsselect-element = "text-value-3"

fs-cmsselect-element = "select"

fs-cmsselect-element = "select-2"

fs-cmsselect-element = "select-3"

Working examples

See this solution working live in this Webflow project.

Example 1

Add CMS items to a form select field

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

Copy and paste this example directly on Webflow

Coming soon

Combinations using CMS Select:

You can combine this Attribute with others to create more complex solutions.

CMS Filter

CMS Select

How to add an attribute:

Copy the Solution <script> and paste into the <head> of your page

Implement in Webflow

Apply attributes to elements on the page

Text Element

Select Field

Working examples

Combinations using CMS Select:

Create a filter and populate a select field with dynamic content.

Frequently Asked Questions

Developer documentation

Next time implement inside Webflow

Need more help? Use the Automated Support

Sign up for future releases!