Hi everyone!
I’m very new to webflow community and starting to learn about the tools.
So, I’m designing a collection item that have a div that represent an image. I’m planning to inject the image url from other sources using HTML embed. Then I want to make a that div (which contain image via backrground-image url) disappear if there’s no url associated with it.
My question,
I’m not sure if this is possible to do in webflow or do I need to add additional logic as extra code? I considered not so good in coding, so if Anyone can help me walk through will be super nice.
@juragan welcome to the forum! What I’d do is use a switch field. That’s the easiest way to set up conditional visibility in some cases. So you’d add a switch field to your collection, switch it to ‘off’ for any item in your CMS that doesn’t contain the image. This is an article from the university explaining how to set that up Switch field | Webflow University.
I’ve got to ask, why use a background image? Accessibility-wise it’s always best to have anything that provides context as an image and anything that’s just decoration as a background image.
@juragan you’re welcome, that’s why we’re here . Yes, images work pretty much the same as background images in a div, so use a regular instead. Here’s a link to the webflow university about interactions, specifically triggers like switches Interactions & animations course | Webflow University. There’s loads more about interactions on the university but this should give you a good idea of where to start.
. Yes, images work pretty much the same as background images in a div, so use a regular instead. Here’s a link to the webflow university about interactions, specifically triggers like switches