Collection page grouping with customized code

[kgamboz]

I have a theme developed by halothemes. They customized code for us to get around the 100 variant limit by utilizing a metafield for colour swatches. Here is ONE style of bra which we have available in many colours and sizes. Each colour variant is created as a separate product, but they are all linked via their colour swatches. When you click on a colour variant, it takes you to that product page but gives the appearance you are still on the same page just viewing it in another colour; as all the colour swatches will show on each product page. This customization is so useful for us as bras are often cut in new colours each season. Keeping them as separate products is amazing during sale time, because I can add only certain colours into collections to be discounted/use a discount code on. Without the customization, I would have to manually mark down only certain colour variants as they would all be contained within one product. This is what the customization looks like on our website - just like a product with many variant options would.

I have linked many of our products using the customization which our developer did for us. The problem which I have run into, is of course that each product (colour variant) now shows up in any collection they are in. I would like to have the same customization with the variant swatches to show up on my collection pages, but to ‘consolidate’ them into one product.

This is an example of what I would like to see on my website collection pages (created hastily in paint):

I have reached out to my developer for help and this was their response:

“We’re so sorry that we can’t change as per your request because we can’t gather products in the variant list of a product card.”

Can anyone help me to achieve the above example on collection pages?

Thank you,

-Katie

[Savior]

@kgamboz

In short, you want to add Swatch on Collection page, but this needs to be done by a developer. So need to hire one.

---

If helpful then please Like and Accept Solution. Want to modify or custom changes on store Hire me. Feel free to contact me on shopify.dev.34@gmail.com | Shopify Design Changes | Custom Modifications In to Shopify Theme

[PaulNewton]

@kgamboz contact me to get this customization , paull.newton+shopifyforums@gmail.com

This is a “product-family” or “product-line” customization also common with Merchants who have a flat product model often due to a pre-existing ERP problem, or want the per product control for sales channels or as you pointed out discount control that would otherwise apply to all variants under a product.

“We’re so sorry that we can’t change as per your request because we can’t gather products in the variant list of a product card.”

The developer response is confusing you wouldn’t use the variant-list for that anyways but I get the gist of it, they are probably alluding to the difficulty of building the swatches in the product card on collection pages for many many many products. Which probably means they may be using the all_products global object which is limited to 20 uses per page, we’ll have to see.