How to Display Shopify Variants on Collections Pages

soup_sam

I am having difficulty displaying all variants of products on my shopify collections page. I am using Ritual theme v3.2.1 . In the main-collection.liquid file is where I see the loop to capture collection products and display them in the product-grid . Once I create a for-loop to cycle through product variant information and then try to leverage it, errors occur. I have placed comments in the code below to walk through my steps thus far....

Originally asked by Matthew on Stack Exchange (stackoverflow) (CC BY-SA 4.0).

uphilltech

Great question — answering as the UphillTech team:

The issue is mainly related to the theme block working. You are iterating over the variants and while passing the data in the _product-card you are passing closest.product . Due to which the errors are occurring. The _product-card block is generally designed to work with the product object, not a variant object. To render the variant-specific information you need to explicitly pass the variant to the card: {% render '_product-card', product: product, variant: variant %} And inside the _product-card you can access the values like – variant.title, variant.price, variant.featured_image etc. Please keep in mind that using this approach may affect the pagination counts or filtering behavior as...

Full answer by Knowband Plugins: https://stackoverflow.stackexchange.com/a/79909896 (CC BY-SA 4.0).

Need it done for your business? UphillTech.