Knowledgebase

How to hide the "Add to Cart" button in Magento

If you want to remove the "Add to Cart" button from the frontend of your Magento store, you can do that with a few modifications to some of your theme's files.

As an example we'll assume that you use the default Magento theme that comes prepackaged with Magento and your Magento is installed directly in the public_html folder on your Magento hosting account, meaning the store is accessible at yourdomain.com.

To hide the "Add to Cart" button on category/product list pages you need to edit the file list.phtml. With the default theme and public_html being the root Magento folder, the path to the file will be public_html/app/design/frontend/base/default/template/catalog/product/list.phtml. In the file find the following code:

<p><button type="button" title="<?php echo $this-<__('Add to Cart') ?>" 
class="button btn-cart" onclick="setLocation
('<?php echo $this->getAddToCartUrl($_product) ?>')">
<span><span><?php echo $this->__('Add to Cart') ?></span></span></button></p>

and comment it out. To comment it out put an exclamation mark and two hyphens after the first bracket (e.g. <!--p) and two hyphens before the last one (e.g. /p-->). Note that there are two instances of this code in the file. The first one is around the middle of the file and it's responsible for the list view that displays products in a single column on category pages on the frontend. The second instance is closer to the end of the file and it's for the grid view. So comment out both instances to remove the button from both views. You can edit the file from the Files section of the Pixie control panel, or you can download it on your local computer with an FTP client (e.g. FileZilla), edit it with a text editor (e.g. Notepad) and upload it in the same folder replacing the old file.

To hide the "Add to Cart" button on product details pages you need to edit the file addtocart.phtml. The path to the file with the default theme is public_html/app/design/frontend/base/default/template/catalog/product/view/addtocart.phtml. Find and comment out the following code:

<button type="button" title="<?php echo $buttonTitle ?>" 
class="button btn-cart" onclick="productAddToCartForm.submit(this)">
<span><span><?php echo $buttonTitle ?></span></span></button>

Product view pages have a container that besides the "Add to Cart" button also shows the price, a field for the quantity, and "Add to Wishlist" and "Add to Compare" links. If you want to remove them all you can hide the container. To do that you have to edit the file bottom.phtml. The path to it for the default theme is public_html/app/design/frontend/base/default/template/catalog/product/view/options/wrapper/bottom.phtml. Comment out the following code:

<div class="product-options-bottom">
    <?php echo $this->getChildHtml('', true, true);?>
</div>

Keep in mind that this will not hide the "Add to Cart" button on product pages displaying grouped products. For that you have to keep commented out the code in addtocart.phtml.

If you want to remove the "Add to Wishlist" links on category pages, there are a few ways to do it. The easiest is to change the relevant settings in the admin panel. For more information check out the article on disabling the wishlist feature in Magento.

In case you also want to hide the "Add to Compare" links on all pages you can find one solution in the article on disabling the comparison function in Magento. There you'll also find suggestions on how to remove the sidebars connected with that function.

You may also find useful the article on hiding product prices on the frontend in Magento.

Also Read