We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

HELP! Need to remove "Add to Cart" button from a specific Collection Page

Solved

HELP! Need to remove "Add to Cart" button from a specific Collection Page

TipsyTruck
Tourist
5 0 1

Hello! I am having trouble with customers clicking "Add to Cart" on our gifts collection, which bypasses the product page and adds the item directly to their shopping cart. While this is fantastic for most items on our site, our "gifts" collection needs more information from the customer, so bypassing this page creates a lot more work for me as I then have to contact the customer to get the details I need. Additionally, some of our products have a variant for a rush fee and bypassing the product page means that they aren't paying that fee, so it's really important that I get this resolved. I'm using the Supply theme. Any help with clear directions is hugely appreciated. Thanks in advance. Cheers! 

https://tipsytruckdelivery.com/collections/gifts

Untitled-1.jpg


Untitled-2.jpg

Owner, Tipsy Truck Delivery
tipsytruckdelivery.com
Accepted Solution (1)

EBOOST
Shopify Partner
1409 352 438

This is an accepted solution.

Hi @TipsyTruck 

May I suggest to update code these steps:

1. Go to Store Online-> theme -> edit code
2. Assets/theme.scss.css
3. Copy code below to bottom of file

.collection-template-section .grid-uniform .grid-item form {
	display: none!important;
}

Hope can help

If you find my reply helpful, please hit Like and Mark as Solution

EBOOST

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free. Github.com/eboost10
- ❤❤DONATE ❤❤Coffee tips

View solution in original post

Replies 8 (8)

EBOOST
Shopify Partner
1409 352 438

This is an accepted solution.

Hi @TipsyTruck 

May I suggest to update code these steps:

1. Go to Store Online-> theme -> edit code
2. Assets/theme.scss.css
3. Copy code below to bottom of file

.collection-template-section .grid-uniform .grid-item form {
	display: none!important;
}

Hope can help

If you find my reply helpful, please hit Like and Mark as Solution

EBOOST

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free. Github.com/eboost10
- ❤❤DONATE ❤❤Coffee tips
TipsyTruck
Tourist
5 0 1

Oh My Gosh! @EBOOST  is my HERO!!!

 

Thank you, thank you, thank you!!

Cheers!
Jo 🥂

Owner, Tipsy Truck Delivery
tipsytruckdelivery.com
Afeefa
Visitor
1 0 0

Hey there! 

How do we use this to remove ADD TO CART button from one specific collection page?

 

RothkoAndFrost
Visitor
3 0 0

There's a neater way to remove from either all collections or just specific ones, and that's using the Custom CSS box within the Product Grid Section. The code to use is:

 

.card-product-actions {
display: none !important;
}

 

To get here, within your admin panel select:

 

Sales channels > Online Store > Themes > Customize

 

Within the theme customizer, use the drop down at the top to navigate to Collections, and select the Collection template from which you wish to remove the Add to Cart buttons.

 

Within the template, on the left hand select the Product grid Section. Bottom right of this is a Custom CSS box, into which you can put the above code.

 

Then, make sure you apply this template to any Collections you want to remove the button from, while leaving the rest as default and the button in place.

 

For example in our store we offer custom guitar headstock decals, so on the collection pages for these we have removed the button: https://rothkoandfrost.com/collections/pursuit-luthiery-headstock-decals

 

Whereas on collections with standard non-customised items the button remains: https://rothkoandfrost.com/collections/pursuit-luthiery-guitar-finishing-guitar-spray-paint

 

Hope this helps!

Simon

TipsyTruck
Tourist
5 0 1

Hi there... this solution didn't work for me, but I really need it to as I only need the "add to cart" option removed from my gifting collection. When I add the custom css code as listed, the button is still there. Help is so so so very appreciated!

TipsyTruck_0-1697935829885.png

 

Owner, Tipsy Truck Delivery
tipsytruckdelivery.com
CNDY_123
Excursionist
50 0 5

Did you get the issue resolved? I have You exact same issue and could not find a solution. 

 

It would be great if You could share the solution. 

 

Thanks in advance.

EBOOST
Shopify Partner
1409 352 438

Hi @Afeefa ,

You need add a tag to this collection after that use liquid code check & hide add to cart button.

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free. Github.com/eboost10
- ❤❤DONATE ❤❤Coffee tips

RothkoAndFrost
Visitor
3 0 0

There's a neater way to remove from either all collections or just specific ones, and that's using the Custom CSS box within the Product Grid Section. The code to use is:

 

.card-product-actions {
display: none !important;
}

 

To get here, within your admin panel select:

 

Sales channels > Online Store > Themes > Customize

 

Within the theme customizer, use the drop down at the top to navigate to Collections, and select the Collection template from which you wish to remove the Add to Cart buttons.

 

Within the template, on the left hand select the Product grid Section. Bottom right of this is a Custom CSS box, into which you can put the above code.

 

Then, make sure you apply this template to any Collections you want to remove the button from, while leaving the rest as default and the button in place.

 

For example in our store we offer custom guitar headstock decals, so on the collection pages for these we have removed the button: https://rothkoandfrost.com/collections/pursuit-luthiery-headstock-decals

 

Whereas on collections with standard non-customised items the button remains: https://rothkoandfrost.com/collections/pursuit-luthiery-guitar-finishing-guitar-spray-paint

 

Hope this helps!

Simon