If your Collection images aren't displaying in a Collection List on your portfolio page in Webflow, even though each item has images assigned, the issue usually involves image binding or image field settings.
1. Check Image Binding in the Collection List
- Select the Collection List or Image element inside your Collection List.
- In the Element Settings panel, confirm that the image is correctly bound to a Collection field (e.g.,
Main Image
, Thumbnail
, etc.). - If you see “Get Image from…” displaying as empty or not bound, click it and choose the correct image field from your Collection.
2. Ensure the Image Field Is Not Empty in the CMS
- Go to the CMS (Collections > Your Collection) and open a few Collection items.
- Confirm that the image field (e.g., Image, Thumbnail, etc.) actually contains uploaded images for each item.
- If any items are missing their images, those entries will not display images unless the field is set with a default backup image in design.
3. Check Visibility Settings and Conditional Visibility
- Select the Image element inside the Collection List.
- Open the Style panel, scroll to the bottom and check if there are any Conditional Visibility rules applied.
- If the image is hidden when a condition isn’t met (e.g., “Only display if caption is set”), it might be unintentionally hidden.
4. Verify That You Are Using an Image Element, Not a Background Image
- If you’ve added the image as a background image via styles, it won’t update dynamically from the CMS unless you set that background FROM the Collection Binding.
- To bind a dynamic background image, select the div or container, go to the Style panel, and next to the background image settings click “Get Image from” and choose the CMS image field.
- Using a standard Image element is generally safer for CMS binding.
5. Confirm You're Viewing the Right Page Template or Collection List
- Ensure you're working within the correct Collection List on the portfolio page and not a static image or the wrong Collection.
- If you are using a Collection Page, item-specific content will only show per individual Collection item pages, not dynamically across a list unless you're using a Collection List wrapper.
6. Publish the Site After Changes
- Images may appear as broken links or not update properly in preview.
- Always click "Publish" to your domain and refresh the live site to test actual image rendering.
Summary
To fix missing images in your Webflow Collection List, make sure the Image element is correctly bound to the image field, the CMS Collection items contain the images, and there are no conditional visibility or styling issues hiding them. Use dynamic image binding, and publish changes to confirm updates.