How to remove 'Compare this Product' and 'Add to Wish List' in OpenCart 2.0

March 13, 2015
opencart wish list compare ocmod

‘Compare this Product’ and ‘Add to Wish List’ are great features in OpenCart however for some stores they are just not needed. Unfortunately there is no functionality or setting where you can disable these two features. In this tutorial I will show you how to remove the ‘Compare this Product’ and ‘Add to Wish List’ buttons from all places in your OpenCart store. For this tutorial I will use a clean installation of OpenCart 2.0.1.1 with the Default theme enabled.

In order to remove the ‘Compare this Product’ and ‘Add to Wish List’ buttons we have to modify several OpenCart templates. We can make the modifications directly in the template files, which I do not recommend, or we can make them as a new OCmod modification. Creating modifications using the OCmod modification system is much safer, because no core files are being directly modified plus we can revert back the default functionality at any time.

Creating a new OCmod file

We can use almost any code or text editor and create a new blank XML file. Once we create the file we should create the skeleton of our OCmod file. You can copy/paste the code below, and change the name, version, link, author and code with your personal information.

<modification>
    <name>Type a name of this modification</name>
    <version>The version of the modification in numbers (ex. 1.0)</version>
    <link>http://yourwebsite.com</link>
    <author>Your Name</author>
    <code>unique_identifier_for_the_modification</code>
</modification>

Once we save the file we should add the ‘.ocmod’ extension after the file name - ex. modification.ocmod.xml.

Applying the changes

Now that the OCmod file is ready we start adding the modifications, one by one. The modifications are added before the closing </modification> tag.

1. Remove ‘Compare this Product’ and ‘Add to Wish List’ from Bestsellers, Featured, Latest, Specials.

Let’s start with removing the ‘Compare this Product’ and ‘Add to Wish List’ buttons from the default OpenCart modules - Bestsellers, Featured, Latest and Specials. 

<file path="catalog/view/theme/default/template/module/{bestseller,featured,latest,special}*.tpl">
    <operation>
        <search><![CDATA[<button type="button" data-toggle="tooltip" title="<?php echo $button_wishlist; ?>" onclick="wishlist.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-heart"></i></button>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
    <operation>
        <search><![CDATA[<button type="button" data-toggle="tooltip" title="<?php echo $button_compare; ?>" onclick="compare.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-exchange"></i></button>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
</file>

 

2. Remove ‘Compare this Product’ and ‘Add to Wish List’ from Category Page.

There are ‘Compare this Product’ and ‘Add to Wish List’ buttons for each product in the Category Page, both for the Grid and List views. Let’s remove them.

<file path="catalog/view/theme/default/template/product/category.tpl">
    <operation>
        <search><![CDATA[<button type="button" data-toggle="tooltip" title="<?php echo $button_wishlist; ?>" onclick="wishlist.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-heart"></i></button>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
    <operation>
        <search><![CDATA[<button type="button" data-toggle="tooltip" title="<?php echo $button_compare; ?>" onclick="compare.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-exchange"></i></button>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
</file>

 

3. Remove ‘Compare this Product’ and ‘Add to Wish List’ from Product Page.

<file path="catalog/view/theme/default/template/product/product.tpl">
    <operation>
        <search><![CDATA[<button type="button" data-toggle="tooltip" class="btn btn-default" title="<?php echo $button_wishlist; ?>" onclick="wishlist.add('<?php echo $product_id; ?>');"><i class="fa fa-heart"></i></button>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
    <operation>
        <search><![CDATA[<button type="button" data-toggle="tooltip" class="btn btn-default" title="<?php echo $button_compare; ?>" onclick="compare.add('<?php echo $product_id; ?>');"><i class="fa fa-exchange"></i></button>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
</file>

 

4. Remove ‘Compare this Product’ and ‘Add to Wish List’ from Search Page.

<file path="catalog/view/theme/default/template/product/search.tpl">
    <operation>
        <search><![CDATA[<button type="button" data-toggle="tooltip" title="<?php echo $button_wishlist; ?>" onclick="wishlist.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-heart"></i></button>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
    <operation>
        <search><![CDATA[<button type="button" data-toggle="tooltip" title="<?php echo $button_compare; ?>" onclick="compare.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-exchange"></i></button>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
</file>

 

5. Remove ‘Wish List’ link from header.

After you have all the ‘Add to Wish List’ buttons removed from your store, there is no need of the ‘Wish List’ link in the header top bar. Let’s remove it as well.

<file path="catalog/view/theme/default/template/common/header.tpl">
    <operation>
        <search><![CDATA[<li><a href="<?php echo $wishlist; ?>" id="wishlist-total" title="<?php echo $text_wishlist; ?>"><i class="fa fa-heart"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $text_wishlist; ?></span></a></li>]]></search>
        <add position="replace"><![CDATA[]]></add>
    </operation>
</file>

 

We have all the modifications added which will remove all the 'Compare this Product' and 'Add to Wish List' buttons. Now we have the save the file and install in on the store using the Extensions Installer.

However this modification will cause a small glitch for the places where we have the ‘Add to cart’ button grouped with the 'Compare this Product' and 'Add to Wish List' buttons.  For example we have such button group in the Featured module and on the Category page. The glitch is caused by the fact that this button group has a certain width and the ‘Add to cart’ button width is set to 60%, which means it will not take the full width of this button group. In order to fix this glitch we should apply a small modification in the stylesheet.css file which is located in catalog/view/theme/default/stylesheet/stylesheet.css. We should search for the following CSS selector ‘.product-thumb .button-group button’ and change its width from 60% to 100%.

.product-thumb .button-group button {
    width: 100%;
    ...
}

Conclusion

This tutorial is made especially for the Default OpenCart theme but I think the same result may be achieved for other custom themes after small changes in the modifications. However, 'Compare this Product' and 'Add to Wish List' are features which may have impact on your sales, so think twice before cutting them off.

You can find the OCmod modification file that I created for this tutorial here.

Join 11,000+ subscribers receiving actionable E-commerce advice

* Unsubscribe any time

Trending blogs

comments powered by Disqus