Use Collection fields to build custom Collections

Collection Fields aren't website elements, they're simply Fields where data is stored for each Collection item, which you’ll be able to reference in your designs. You can build your Collections by adding Collection Fields as needed for the type of content you’re working with. You can also update the structure of existing Collections and Collection templates, or add custom Fields to Ecommerce Collections.

Open the CMS collection panel and create a new collection or choose an existing collection and open the collection settings to update its structure. 

Learn more: Collections

In this article

1. Use Collection Fields to build your Collection
2. Delete a Collection Field

Use Collection Fields to build your Collection

There are many different field types to choose from when structuring your collection. Each field translates into different kinds of content that you incorporate into the design for your project.

Plain text field

Adds simple unformatted text to your collection items. It can be connected to any text element (Add panel → Typography section), except rich text, when designing with your content.

Rich text field

These are made for long-form content, like a blog post. It allows editors to add in headings, paragraphs, and media like images and videos right inside this one field.

Image field

Adds an image to your collection items. These can be used as regular images or background images in your designs.

Multi-image field

Add multiple images to your collection items. These can be used as regular images or background images in your designs. Multi-image fields can be connected to Collection lists and lightbox media on Collection pages.

‍Video field

Adds videos hosted on platforms such as YouTube or Vimeo through a URL. These are usually connected to a video element.

Link field

Adds a generic link that can be connected to any link element such as a button, a text link, or a link block.

Email field

Adds an email address field to collection items that can be connected to any link element in your designs.

Phone field

Add a phone number to collection items that can also be connected to any link element in your project.

Number field

Add any kind of number (integer, decimal) to your collection items. You can use this field in your designs by connecting it to any text element.

Date/Time field

Add a date and time picker to your collection items. This connects to any text element and can be set to use any format (month, day, year) in your designs.

Switch field

Adds a way to separate collection items. It can be used to filter collection lists.

Color field

Adds a unique color to each collection item which can be applied as text color, background color, and border color in your designs.

Option field

Creates a list of predefined values so you can pick one for each collection item.

File field

Adds a file to your collection items that you can connect to any link element in your project.

Reference field

Links to other collection items from the same or different collections. You can link CMS collections to Ecommerce collections and vice versa. In your designs, you can reference both collection items.

Multi-reference field

Similar to a reference field, but you can link to multiple items from a collection of your choice.

Delete a Collection Field

When you’re updating the structure of your Collection, you can delete any Collection Field that isn’t used in your site, except for default ecommerce Fields.

Delete a Collection Field

To delete an unused Field from your Collection:

1. Open your Collection settings
2. Click the Field you want to delete
3. Press the trashcan to remove it from your Collections structure

Delete a used Collection Field

If you cannot delete a Collection Field from your Collection settings, it’s likely that the Field is connected to an element or a setting in your project. You need to remove all instances of that Collection Field in your project so you can delete the Collection Field.

1. Remove connections to a Collection Field
2. Delete the Field once all connections are removed
3. Reconfigure any Zaps and API connections that may have used this Field

Remove connections to a Collection Field

Removing connections to Collection Fields may affect your visual design and code embeds. If you’re sure you want to remove all connections from a specific Field:

1. Backup your project because removing connections is irreversible
2. In your Collection settings, click the Field you want to delete
3. Click the link icon to see where in your site that Field is used
4. Disconnect all connections one by one until there are no connections left

Delete the Field once all connections are removed

Once you remove all the connections, you can delete the Field from the Collection settings.

If you still can’t delete a field, check your Collection Page settings. The Field can be in SEO, Open Graph, RSS, or Site Search settings. It might also be in the Custom code section. Remove it from these settings, then go back to your Collection settings and delete the Field.

Reconfigure any Zaps and API connections

If you’ve used this Field in Zapier or other apps using the CMS API, check and reconfigure any Zaps or API connections that may get broken when you delete this Collection Field. Also note that restoring a backup of your site after deleting a Field may still cause issues with such third-party integrations.