Streaming live at 10am (PST)

Best way to approach conditional columns from CMS fields?


#1

I would like to dynamically create columns based on the amount of images I add in a CMS collection item. There doesn’t seem to be an easy way to do this with the binding settings.

My thought is to have a few different types of layouts and conditionally show them based on the images that are set. For example, if only the first 2 images are set it will show a two column layout, however if 3 or 4 are set it will hide all other layouts and assume that all the images have been populated whereby it would show a sophisticated layout and hide all other layouts.

Does this have any performance drawbacks considering there would be duplicate image galleries? I’m assuming not because they are conditional, but I don’t know if that is done before the rendering or after.

https://preview.webflow.com/preview/cameronroe?preview=046e9f3461679607a791919ecede55f6


#2

Its hard to know. Style the images 1-2 other than 3-4-5… its very easy without any JS or complex ideas using this (add custom css)
https://www.w3schools.com/cssref/sel_nth-child.asp

Change the layout its more complex. You cannot achive this without custom JS. Add some class thats change the layout and ideas like this and/or combine some if-else with webflow API, so this is more job-aboard (its hard to solve this without all the detials).

Duplicate layout its bad for SEO/Performance/Accessibility + very hard to manage over time

By js - mabye get the number of images in div X - than add some “if” number-of-images > 3 - do something (like this you dont need the webflow-API)

In the URL you added i dont see any images (so add screenshot if this answer wont help you) - and more detials (screen of layout1 and layout2)


#3

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