Collection content is disappearing

I have 32 items in a collection, and then 30 or so elements available to each page, but each page doesn’t use every element, so some items stay blank for diff pages.

I have gone through several of the collection pages and connected the various elements to those pages. But when i got back to check each page, some of those elements are empty, while others are still there. Specifically I’m having issue with a list of products. Some of the products stay on the page, and other product elements are empty, just leaving me with empty divs.

The collection is called - Business Insurance Professions
This page you’ll be taken to is our Architect Insurance page. In the middle of the page there is a popular insurance section. It only shows 3 products now, but there should be 5.

https://preview.webflow.com/preview/cp-content-cpsite2?utm_medium=preview_link&utm_source=designer&utm_content=cp-content-cpsite2&preview=da5067445f161861432092499ad77907&pageId=6012e4371dc8af464a8e8ed9&itemId=60130c3a0b44897d6400d47c&mode=preview

Hope you can help.

I’ve discovered what the problem is. When I add a new product to one page, it adds it to all 32 pages, but if those other pages don’t have elements for that product, then those divs are empty. If I remove those empty divs from one page, it removes it from all pages.

How can I hide the divs from each page that don’t need to show them, while keeping them for other pages?

With your div selected In the settings panel, you’ll find the “Conditional Visibility” section which will allow to show items based on whether there is or isn’t any content set.

Hope this helps :sparkles:

1 Like

Hey Randall!

Just wanted to second what @Johnelle_Smith is saying! Conditional Visibility is definitely the way to go for your use case.

For future reference, as you have already seen, keep in mind that, since you’re using a Collection, all individual pages within that Collection are linked. So therefore whenever you delete a div or other element from one page, it will delete from the other. This is why conditional visibility is so important, as it will force the Collection to only show certain elements when a condition (or a set of conditions) is met.

Let me know if you need anything else! :smiley:

1 Like

Thanks very much for your help. This is working, but because I have so many pages, this is what I’m having to do -
I want to hide product X on this one page, and I use the condition: if header element is not equal to “condition one” then hide. That works for that page, but when I have 10 or more other pages that don’t need that product, I have to add a new condition for each of those pages, so I end up with 10 or more conditions for one div.

Couple questions -

  1. Is there a way to make that easier, then adding so many conditions?
  2. If we end up changing the copy on the page, I’ll need to update all of my conditions. Is there a way around that?

Thanks for the input.

Ok I used my head finally and found the fix. I just added a condition that if this element was Set then it should show or hide. That saves me a lot of trouble.

Thanks for getting me on the right track!

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.