Streaming live at 10am (PST)

Same image on every page with CMS


#1

Hi,
I want to make my own portfolio, separated in categories (like animals, landscapes, etc.).
I want to use the CMS for it, so I don’t need to do it all manually and just need to set it up one time.
For doing so I worked on the “Projects Template” page (link down below).
I set up everything as I wanted, but then I realized, that on every page (or every category) are the same images. And I can’t change them separately.
How can I set up a custom template for every category I create?
For the images, I created a new collection and put them inside. On the “Projects Template” page I used a Collection List with images inside to display them.
Links:
Read only: https://preview.webflow.com/preview/versuch-1?preview=3ffd714e0d483eeaeedebc8fa8cc6818
Published: http://versuch-1.webflow.io/projects/sketch-designs

Thanks for your help.


#2

Take a look at Multi Reference Fields

You can use the same collection but point to different sets of photos.


#3

Thanks, but I don’t know if this really solves my problem.
How do I display the images? I set up the multi reference field but I don’t see my images on the page.
I am not sure if I explained my problem correctly, because my English isn’t that good.
I want unique images in every portfolio category. To do this I set up a new collection named: “Portfolioposts” and imported some dummy elements with a title and one picture in it.
In the pages drop down menu “Page: Projects Template” I added a “Collection List” and imported the “Image” element into it. Then I selected “Get Images from Portfolioposts”. Fine, worked. But then it’s on every page. Also on the other category where should be some different pictures.
The categories are created with another Collection named “Projects” (it’s the default one from the template I am using).
You can see what I mean in the “Read only” link.


#4

It allows you to reference the photos on a template page. After looking at the page, you can use the single reference, you don’t need multi reference.

Build a collection “photos” and add an entry for each type “sketch designs, company logos, etc”.
Add a reference to the “photos” collection from the “projects” collection.
Create a new projects entry for “sketch designs, company logos, etc” and select the proper reference.


#5

Well, thanks. But then I dont have the grid I made before. I need to adjust every image by itself and cant use my own created template. Or did I understand you wrong?


#6

You can keep the grid. Use Collection List component and use an image in the list. Select the referenced photos.


#7

Okay, Tanks.
I tried it and it doesn’t work for me. It sounds correct, but maybe I didn’t understand correctly what you mean.
So that’s what I did:

  1. I go to CMS Collections and created a new collection called “Photos”.
  2. Inside “Photos” I added the “Collection Fields”: “Name” and (the number of) “Images” (I need)
  3. Then I clicked on “New Photo” and created “Sketch Design” and “Company Logos” and added my pictures.
  4. I go to my “Projects” collection, edit it and add a “Reference” Collection Field.
  5. Going to “Sketch Design” and “Company Logos” and added the reference to the Photos Collection (for both)
  6. Next, I go to my Template page and add a “CMS List” and put the image element inside.

Edit for correct solution:
7. For the CMS List Settings pick the created reference or multi reference

Again, on every page the same image. But I think I did it wrong. Sorry.


#8

#7 is the referenced photos field from the projects collection, not “Photos” collection.


#9

Oh man…
I’m really sorry. I never saw that I can scroll further down. Didn’t noticed that I can select “references” in the Cms List settings.
Thanks a lot for your help. :slight_smile: