Add to cart button with the same behavior as on the product page

Shopify Discussion
1

Hi everyone,

I would need to add “add to cart” buttons on the collection page of my online store (on this page https://smokenuud.com/collections/vapes). The problem is that I would like this button to have the same behavior as the one on the product page (on this page https://smokenuud.com/products/vanilla-lavender). Does anyone have an answer?

Thanks in advance.

2

Hello @Lucas72 ,

Your feature needs Customize.
You should hire someone who knows coding or an expert in Shopify programming, they can help you with this.
In addition, you can contact the theme provider you are using, maybe they can help you fix it.

Kind & Best regards,
GemPages Support Team

3

Hello @Lucas72 ,

A while ago I posted a solution for same theme you are using https://community.shopify.com/post/1314574 maybe the version you are using is different but you can take an idea from here if you are comfortable with liquid.
or you can drop an email to discuss and enable this feature on your sore.

Thanks

4

Hello @Lucas72

Let’s try enable the option “Enable quick add button” in the theme’s editor : https://prnt.sc/R1qz9RZXsex4

I hope the above is useful to you.
Best regards,
GemPages Support Team

5

Hi @Lucas72

I saw that you need to add “add to cart” buttons on the collection page of my online store. It’s what we can help with at an affordable price. Can you kindly share your request with us via Shopify experts https://experts.shopify.com/bss-commerce/services.

We will check it and give you an optimal solution. Looking forward to working with you.

6

Hello to all,

Thank you for your answers first of all!

Having created the site myself in full html/css (with the custom liquid sections), I managed to find the solution. Indeed, I took the html code of the form including the “add to cart” button (from the Chrome console) which is present on the product page and I inserted it in the custom liquid section of the “collection” page. Until then everything was fine, but by doing it this way, the “add to cart” button was not behaving like on the product page. While searching a bit I realized that the javascript call was not triggering and so I copied/pasted this line that is present on the product page into my “collection” page:
(only works with the “Dawn” theme I think)

As for the “add to cart” button, I copied/pasted it manually from each product page.

This way everything works correctly!

If you want to show the result: https://smokenuud.com/collections/vapes

Thanks again,

Lucas