Magento 2How To GuideApril 15, 2021

How to Disable the Add to Compare Button in Magento 2?

How to Disable the Add to Compare Button in Magento 2?

The ‘Add to Compare’ button allows customers to compare products with respect to their properties, characteristics, and prices. This helps them make an informed purchase decision.

Magento 2 does not lack anywhere and provides both customers and merchants with all the features that they may need. An important feature from a customer's perspective is the product's comparison functionality to compare all the competing products in an online store and choose the one that offers them the best value for money.

This feature is particularly important for electrical equipment stores and products with a large set of technical properties and parameters. When customers click the ‘Add to Compare’ button for multiple products, the comparison table/page allows them to analyze all the features of every product on a single page making it extremely easy for them to pick the one of their choice.

Without the comparison feature, it would have been difficult for users to navigate across the variety of products, study the characteristics, and understand how the price of a particular product is formed.

Why would you want to disable the ‘Add to Compare’ button?

While the add to compare feature is great for technical products, you may want to disable it for items for which the purchase decision does not depend on the features and price balance.
Quick Note: Hide Add to Compare Button with our Magento 2 Hide Price Extension
For example, for apparel products or shoes, this feature may seem irrelevant as the purchase decision does not depend on features comparison but on customer’s color, size, and design choices.

How to disable the ‘Add to Compare’ button in Magento 2?

Unfortunately, there is no option to disable the add to compare button in Magento 2 backend. However, you can do it programmatically. The following code will remove the compare button from header, product, category pages and layer navigation.

Create default.xml file in app/design/frontend/Theme_Vendor/Theme_Name/Magento_Catalog/layout and copy the following code.
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
 <body>
 <referenceBlock name="catalog.compare.link" remove="true" />
 <referenceBlock name="catalog.compare.sidebar" remove="true"/>
 <referenceBlock name="catalogsearch.product.addto.compare" remove="true"/>
 <referenceBlock name="category.product.addto.compare" remove="true"/>
 <referenceBlock name="crosssell.product.addto.compare" remove="true" />
 <referenceBlock name="related.product.addto.compare" remove="true" />
 <referenceBlock name="upsell.product.addto.compare" remove="true" />
 <referenceBlock name="view.addto.compare" remove="true" />
 </body>
</page>
  
Now, Set $showCompare variable to false in the following templates:
Magento/Catalog/view/frontend/templates/product/list/items.phtml

Magento/Catalog/view/frontend/templates/product/widget/new/content/new_grid.phtml

Magento/Catalog/view/frontend/templates/product/widget/new/content/new_list.phtml

Magento/Catalog/view/frontend/templates/product/widget/content/grid.phtml

That’s about it. If you've any issue, feel free to contact our support team for an instant solution.

Other Articles: