Only display a number of collection List items that can be devided by three?

Hey All☀️

I want a collection List to only display a number of images that can be divided by three, so my three column grid always looks good. Anybody has an idea how to achieve that? I assume some custom code is needed for that?
I appreciate any help:) Thanks you!

No custom code needed. You can set the number to be displayed in the list within the settings panel. So you can say 9 (like your screen shot) or 12, 15, etc. and then check the box for pagination.

Anni if you’re trying to make that dynamic, yes, you’ll need script.
This feature is built into the Sygnal Attributes lib;

In your case, you’d put the custom attribute wfu-limit-multiple=3 on your Collection List element directly ( not the wrapper ).

Here’s a codepen demo of that lib.
Edit it and change the number of <img> elements to see how it handles your list size limits.
Change the wfu-limit-multiple attribute to see it change the calc.

1 Like

Thank you Michael🙏
That’s what I was looking for!
I will try it out today.
Cheers

1 Like

Hello Anni, it’s nothing about the subject but can I ask you the link of the website ? The design looks great ! Thank you <3