Create CMS driven image only pages

Design help CMS
1

I’m in the process of building a website for a photographer and I’m using Webflow for the first time. There will be individual image only pages for each collection eg. ‘people’ and they will look similar to this.

My question is, what is the best way to build this, so that in the future the client can go in and create a ‘places’ page for example, using the same template and a bunch of new images?

2

Hi @jlan155,

I recommend building this using the CMS as it will speed up your client’s workflow and make adding/editing much easier.

Hope this helps.

Best,
Naweed

3

Hi @nwdsha,

Thanks for advise. I’m thinking I might structure it so each page (i.e. People or Places) is a collection, and in each collection is a bunch of images which will be shown on that collection page. Is that the right way to go about it do you think?

Best,
Jodie

4

Hi @jlan155,

That’s definitely the way to go if you want to make things easier for your client in the future. Otherwise, I doubt he/she is experienced enough to duplicate the page and manually change the images. It’s much easier to create mistakes this way because they could change the page structure etc.

You have several options to try, you could create one CMS collection and set the ‘people’ and ‘places’ as a category. This way, you could have a selection of dynamic items from both categories displaying on the homepage.

I always find ‘trial and error’ to work best. Discover as many possibilities as you can and then implement the best one.

Best,
Naweed

5

Hi @nwdsha,

We actually have two main categories ‘Personal’ and ‘Commissioned’, so having these as the collections and then the individual pages in those collections as ‘People’ and ‘Places’ works really well.

One of the issues I’ve run into is adding multiple images, am I right in thinking the client would have to upload these individually to the image fields as there doesn’t seem to be a gallery or multiple image upload option?

Thanks for your help so far,
Jodie

6

Hey @jlan155

I’d suggest using 3 collections. Of course your naming convention can be different than my example.

  1. Categories (contains two items Personal and Commissioned with flexibility to add later on)
  2. Tags (contains People, Places, and so on)
  3. Photos

Categories
Fields: Name

Tags
Fields: Name

Photos
Fields: Name, Category(single-reference), Tags(multi-reference)

This will make it easy and flexible for the client. They upload an image into the Photos Collection, give it a name, assign 1 category, and any number of tags.

As the designer, you can now add a collection list to any page and use filters to show specific items. For instance, and pageX only show items from Category=Personal and Tag=Place. Linking to the collection template page for Place would show all photos tagged with Place no matter the category.

This will give you tons of flexibility to control which photos show up and where. The client will only ever need to use the Photo collection to upload new work because they can even create new categories or tags from the new Photo item form.

If the client also wants to be able to organize a group of photos as a Project or Work then create a 4th collection. Add the new collection as a reference field in the Photos collection.

Here are some helpful links. Hope this helps. Happy designing!

3 Likes