How to add 'add to cart' button in Shop block

At the moment I import shop products in a product gallery block onto the homepage and I am trying to add a 'add to cart' button beneath each of the products to see if that improves conversion. Is there a way to do this?

I'm using Brine template and the site is at www.oliverjwoods.com

Here's a pic of where I'd like the buttons to go

Thanks for any help!

C

I see you are using a Summary Block to display the products. Squarespace haven't added 'Add to Cart' buttons to Product Summary Blocks and it no longer appears that they will. 

There are therefore three options:

• Use code to add buttons to each product on a Product List Page.
• Use code to add the button to the Summary Items by harnessing the quick view data.
• Use a series of Product Blocks instead. This doesn't scale but is manageable for a few products. There's a checkbox on these blocks that allows you to add the button.

If you plan to use one of the code options, I do recommend hiring a developer to help you.

Ok thanks for your help! Will try the product blocks approach and lobby for the button in Product Summary block. T

Hey Paul - It all seems to be working well, but I've lost the bold product names I had before. I think I used some code but have forgotten – do you happen to know how I should do this? Thanks for your help - last question I promise...

Something like this:

.product-block .productDetails .product-title {
  font-size: 2em;
  line-height: 1.3em;
  font-weight: 600;
}

I just had a client ask me for something very similar! Google around I found this post, and thought I would share my solution... It was not manageable to add hundreds of product blocks and the summary block doesn't contain the item-id needed to link it to an Add to Cart button. It was best to use the product list page. I figured out a solution that works great on desktop and mobile.

https://www.bradgood.net/articles/how-to-add-an-add-to-cart-button-to-a-squarespace-product-list-page

Thanks for the lead, @bradgood - unfortunately I do not seem to get in working in Product Summery Blocks in Pacific template

I am using a different Category Filter with each Product Summary grid - would that make a difference for the code?

Hey @bradgood I tried your code and unfortunately it doesn't seem to be working for me. Do let me know if someone is able to implement it. Thanks!

On 5/23/2020 at 2:21 AM, BureauSF said:

Thanks for the lead, @bradgood - unfortunately I do not seem to get in working in Product Summery Blocks in Pacific template

I am using a different Category Filter with each Product Summary grid - would that make a difference for the code?

On 7/3/2020 at 12:54 PM, divar said:

Hey @bradgood I tried your code and unfortunately it doesn't seem to be working for me. Do let me know if someone is able to implement it. Thanks!

Try this plugin.

by @ThompsonWebDesign

Thanks for the lead, tuanphan . I will check it out and let know how it works. 

22 hours ago, tuanphan said:

 

Try this plugin.

by @ThompsonWebDesign

On 5/17/2020 at 5:10 PM, bradgood said:

I just had a client ask me for something very similar! Google around I found this post, and thought I would share my solution... It was not manageable to add hundreds of product blocks and the summary block doesn't contain the item-id needed to link it to an Add to Cart button. It was best to use the product list page. I figured out a solution that works great on desktop and mobile.

https://www.bradgood.net/articles/how-to-add-an-add-to-cart-button-to-a-squarespace-product-list-page

Hey Brad, this doesn't seem to be working for me but it would be AMAZING if it did!! Can you reach out to me at hello@rentbestdressed.com to see if you can help?

On 8/13/2020 at 10:12 AM, bestdressed said:

Hey Brad, this doesn't seem to be working for me but it would be AMAZING if it did!! Can you reach out to me at hello@rentbestdressed.com to see if you can help?

Can you share link to page where you use Shop Block? We can help easier.

I am trying to add an 'add to cart' button to a summary block showing products. I have implemented @bradgood's code on my main commerce page (thanks!) but I would like to also have add to cart buttons on the pages where I show a summary of products based on tags. Does anyone have any suggestions?

An example website is here:

www.tendrevolution.com/limden-brook-organic

On 9/8/2020 at 11:10 PM, JamesL-TFM said:

I am trying to add an 'add to cart' button to a summary block showing products. I have implemented @bradgood's code on my main commerce page (thanks!) but I would like to also have add to cart buttons on the pages where I show a summary of products based on tags. Does anyone have any suggestions?

 

An example website is here:

www.tendrevolution.com/limden-brook-organic

Have you found the solution yet?