Link block but only if CMS URL present

Design help General
1

New to Webflow, prototyping a project to see if it will work for me.

I have a CMS collection of things that optionally can contain a URL in a custom URL field. I want to use a Collection List to iterate on the collection items and
A - If there is a URL present in the item, wrap the entire block as a clickable link (using a Link Block)
or B - if the item’s URL field is empty, then just use a Div block.

I figured out how to always create the Link Block but if the custom URL field is blank in an item, the link is just empty. I want different styling if the item has an associated URL entered or not.

Is there a way to have logic within a Collection List loop to vary the markup accordingly?

Thanks!

2

Hi, Corey! I think I can help with your question about collection list logic. I fired up a test project and created a dummy CMS where some of the items had a link set and some didnt.

I then built a collection list structured like this:
image

For the selector called ‘has link’, I applied this conditional visibility:
image

Similarly, for the ‘doesn’t have link’, I applied this conditional visibility:
image

The end result (forgive the crude styling, this is just for example purposes):

image
image1322×468 41.9 KB

So, the items with links set display the link block, and the items with no link display the div block. Let me know if I can clarify anything. Hope this helps!

1 Like
3

Chris,

Thanks! I wasn’t sure if I was missing a “selector” type block that allowed if/then/else type conditions but this makes sense to just duplicate the “inner” blocks based on if its present or not. Appreciate the help!

1 Like
4

Brilliant. Thank you! @ColemanChrisB