Hello, I want to display multiple products of mine under a single page with each product having an option to choose the variant and having “add to cart” button separately.
I have seen a shopify store do this and I was looking to achiever something very similar. (https://www.spreadhome.com/products/500-thread-count-italian-cotton-bedding-1?variant=44196433362997)
Can someone please help me as to how to achieve this?
Hi @SohumLinen ,
Maybe this featured needs many code and base on structure of theme as well. So I only suggest a solution for you.
create a snippets/featured-product.liquid → You can base on code of section/featured-product.liquid
in the edit code add a section/shop-collection.liquid → in this file you only need foreach metafied to render snippets/featured-product.liquid
Thanks for the guide.
I have created the metafield and added the related products. Can you help me with the code that you mentioned in Step 3 & Step 4
Regards
Hi,
Which theme are you using?
Dawn theme
Hi @SohumLinen ,
You can follow steps below:
create snippets/featured-product.liquid file
Get code here https://github.com/eboost10/2640367/blob/main/2949850/snippets/featured-product.liquid after that add this code to the file that you created at step 1
Go to sections/main-product.liquid
Add code below to before {% schema %} tag
{% for p in product.metafields.custom.sub_product.value %}
{% render 'featured-product', product: p, section: section %}
{% endfor %}
thanks a lot for the code, the products are now showing under the same product using the metafield and the code you provided.
However, there are some issues like variant is not getting selected, some small format issues, etc.
Is it possible for you to see into the code of our website and help us.
It would be of great help. Please let me know if I can send the collaborator request.
Regards
Hi,
You try to replace code of snippets/product-variant-options.liquid with this code https://github.com/eboost10/2640367/blob/main/2949850/snippets/product-variant-options.liquid.
Hello tried the code, but it is still giving errors. Could you try to edit it within the store once. It would be much easier.
Collaborator code- 5808
Hi,
I have just sent a request to your store.
I have accepted the request.
Kindly please check this product page:
https://sohumlinen.com/products/autumn-embroidered-collection
Hello @EBOOST
We currently have only two variants being shown in the page we made by grouping products (https://sohumlinen.com/products/chain-embroidered-collection), but we want to have one more options like add monogram which we have added by installing a third party app for variants like this in our product page (https://sohumlinen.com/products/pillow-cover-chain-embroidery?_pos=1&_psq=Pillow+Cover±+Chain+Embroidery&_ss=e&_v=1.0), Please help us solve this issue as only 2 variants are showing up in the Grouped Product page currently.
