Streaming live at 10am (PST)

CMS: Images not showing + Not all css coming through


#1

Hi

I made a website for a client - not really live yet, still a splash page - and when revisiting the project I noticed a strange and unsolvable behavior with my collection lists.

  • Not all images are showing (only the first 3): I first thought the file size was the nipple twister but after updating all thumbnails with improved images, the problem persisted.
  • What is also remarkable is that the rounded right bottom corner is not coming through: I also tried to fiddle with my hover interactions (turning them on and off) but to no avail.

What changed during my absence to the project:

  • Turned the project into a project with cms hosting
  • Connected a custom domain to the project
  • Activated ssl
  • Interactions 2.0

In short:

  • It all worked fine and I showed the client already
  • Now it doesn’t look fine without doing anything to the project except the mentioned hosting stuff above
  • Problem has the same behavior in Chrome and Firefox (Mac)

Preview link

Look for the pages

  • “Projecten”
  • Collection: “Categorieën Template”

Really need some help as I:

  • Can’t solve it myself
  • Need to show the links to my client asap

Thank you very much for helping me out.


Here is my site Read-Only: https://preview.webflow.com/preview/imwithalice2?preview=3757ef18e962916b9728bd9871186f5d
(how to share your site Read-Only link)


#2

Hi @skroll that’s definitely concerning behavior! I’m looking into this right now! Lovely site design, really like the image offsets.

From what I see, it looks like most of the “Foto Banner” images aren’t set in your collection items for the “projecten” collection:

I see that one is set for your Groen appartement projecten has a Banner set.

And it’s showing up on your projecten collection page:

You could also switch your image to come from the Foto Thumbnail field instead as those are all uploaded and set (here’s a GIF showing how to make that change: https://cl.ly/3I282l1T0I2S)

Since you did enable SSL Hosting, typically republishing the site does the trick to make sure the SSL images show up on the live site connected to the custom domain.

Please let me know if I’m missing anything :bowing_man: I’m here to help!


#3

@skroll @Waldo

I don’t have a solution but it seems to be related to the “masonery” DIV which has text columns set to 3 - when I reduced it to two, all the projects on the left-hand column had their thumbnails show up:

Sorry I don’t have time to figure it fully out but hope this helps.


#4

One last thing I noticed:
It all seems to come back to the Overflow setting of the project_link which is what’s defining the rounded edge and the frame for the hover effect. You’ve set it to Hidden on the project_link so it crops the image as it zooms in on hover. Perhaps Webflow might be confusing this Overflow setting with the Overflow of the dynamic elements flowing from the first text column to the other two, causing all content overflowing from the first column to get hidden too?


#5

Hi Waldo

Really appreciate you are looking into this. Also, sorry but I should have been more specific.
It’s not really the banner images that cause a problem as I know they are not all set yet.

The problem lies within the grid view. As @feeei also saw, there seems to be a problem with the cms grid on the aforementioned pages. I’ve uploaded some screenshots as to be more clear. Hope it helps.

I will now trie to republish the website and let you know if that solved anything.

What to look for in the screenshots:


#6

Hi Waldo

I unpublished and then republished both live and preview websites and this comes out (cache cleared too):

  • Problem fixed in Firefox
  • Problem persists in Chrome

Can it be a browser related issue that was not there a month ago?


#7

I remove the “rounded corner” and images are showing up again.
Now I still need to fix a hover glitch with the project names.


#8

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