How can I connect a referenced multi-image field from one CMS collection to another CMS collection in Webflow?

Published on
September 22, 2023

To connect a referenced multi-image field from one CMS collection to another CMS collection in Webflow, you can follow these steps:

  1. Create the CMS collections: Start by creating the two CMS collections that you want to connect. Let's call them Collection A and Collection B.

  2. Add a multi-image field: In Collection A, add a multi-image field where you will store the images that you want to reference in Collection B. This field will act as the reference point between the two collections.

  3. Connect the collections: In Collection B, create a reference field and set it to reference Collection A. This will establish the connection between the two collections.

  4. Map the multi-image field: In Collection B, create a multi-image field to store the images that are referenced from Collection A. Make sure to select the appropriate "Referenced Field" from Collection A so that the images are sourced correctly.

  5. Display the images: Now that the connection is set up, you can display the referenced images in Collection B on your website. You can use the image element or a dynamic list to loop through the referenced images.

By following these steps, you can successfully connect a referenced multi-image field from one CMS collection to another CMS collection in Webflow. This allows you to easily manage and display related images across different collections on your website.

Additional Questions:

  1. How can I create a reference field in Webflow CMS?
  2. Can I reference multiple collections within one CMS collection in Webflow?
  3. Are there any limitations to referencing CMS collections in Webflow?