Hi! On my collection page I want to have a collections list with 6 items and dynamically connect them to a metafield. This so I can have sub collections and on each collection I can set sub collection 1, sub collection 2 and so on. The only problem is that now it always show 6 no matter if they are set or not. I want to hide the collection of it’s not set. So if I have sub collection 1 and 2 set on that collection it should hide collection 3-6.
And a sort of related question. If I add more than 6 collections it turns into two rows, but on mobile it’s still one row and I can swipe. Can I have it the same way on desktop?
Do you know? @ThePrimeWeb
Do you know
I need help with this too - have try a few of the suggestions but nothing has worked yet.
To hide Collection Blocks that are empty, pasted this CSS into the Custom CSS box of the Collection list Block:
.collection-list__item--no-media {
display: none;
}
I made this CSS by just inspecting the Collections list in my browser. I saw that empty Collection Blocks had the class “collection-list__item–no-media”, so this CSS code just makes any elements with that class not display.
For me, this made navigating using “sub-collections” super easy. I only needed to make (1) template, no matter how many sub-collections there were under the parent Collection. I needed up to (9) sub-collections, and with this code, I can use (9) Blocks but only have ones being used show up.
Here’s a site I found that explains how to make sub-collections: How To Add Sub-Collections in Shopify: A Beginner-Friendly Guide - Ecommerce Launcher
