Best way to do this?

[Macker (Chris MacDonald)]

Hey guys/girls,

I’m trying to put together some various “project” pages for an architectural website; so a small bit of text and as few as a couple, or as many as a dozen images per project. I’m trying to achieve this with CMS so that collaborators can add individual projects themselves rather than setting up a static page for each project.

Firstly what is the best way to go about this? How might you achieve it? Keeping in mind that not every project has the same number of images, so the page will need to handle this.

I have had the idea that I could create a dozen individual image fields within the CMS and have these load into the project page. This should hopefully allow projects with the full dozen images to load completely, but hopefully the smaller projects with only a couple of images loading only the images they need to and the rest of the image fields/placeholders not displaying at all, or as a kind of null object that (whilst there) is invisible to the user?

Is this possible, and if so is it advisable or are there better/other ways?

[Edit] Ideally there should be a CMS “gallery” feature to allow you to upload multiple images, with captions etc.

Kind regards,

Chris

[Modii (Josh Michaels)]

Webflow allows “conditional visibility” in collection templates. What this allows you to do is make objects visible depending on what is set in that particular collection. To access this you simply click on the item that you want to appear conditionally and then go to the div settings:

Click on the gear icon

Scroll down to “conditional visibility”

Set conditions depending on the element. For example in this screen shot, I have the div set to appear when “Image 1” in the collection is set

So for you. You would make 12 image items and make each of them visible depending on whether their related image in the collection is set.

Hopefully this helps

[Macker (Chris MacDonald)]

That’s absolutely perfect, and very simple too!