Speed up your Magento store with Managed hosting. Use promo: MGT25 Avail Now
Magento 2 Tutorials

How to Disable Add to Cart Button in Magento 2

disable add to cart button magento 2

Marketing the upcoming products before its launch is one of the best tactics for their exposure as it makes users curious about those products. There are many ways to market a product but showing on the store is the best one. But it is necessary to have the add to cart button on that product disabled before it is officially available.

By default, Magento 2 does not provide the feature to disable the add to cart button on specific products. There are some queries from users on how to implement it. After a long research and implementation, I have accomplished this task and so, today I am going to teach you how to disable the Add to Cart button in Magento 2.

I will create a custom module for it, as editing core files are always the worst part. Before learning this guide, it is necessary that you know about custom modules in Magento 2. For that, you can refer this guide: How to Create a Module in Magento 2

Let’s Start!

Steps to Follow

Create Directories

Directories for add to cart button disable Magento 2

Create Module

Create module.xml file in app/code/Magenticians/Mymodule/etc and add the following code in it:

Create registration.php file in app/code/Magenticians/Mymodule and add the following code in it:

Create Attribute and Attribute Set

Create InstallData.php file in app/code/Magenticians/Mymodule/Setup and add the following code in it:

In the above code I have created the attribute set ‘DisableAddToCart’ and attributed it with code ‘text_add_to_cart’ and label ‘Add to Cart Text’. I have also assigned this attribute in the created attribute set.

Override addtocart.phtml

  • Go to vendor/magento/module-catalog/view/frontend/templates/product/view from the root directory of your store and search addtocart.phtml file.
  • Copy this file in app/code/Magenticians/Mymodule/view/frontend/templates/catalog/product/ view.

Create catalog_product_view.xml file in app/code/Magenticians/Mymodule/view/frontend/layout and add this code in the file:

The purpose of above file is to override the addtocart file with our newly created addtocart file (app/code/Magenticians/Mymodule/view/frontend/templates/catalog/product/view/ addtocart.phtml)

Disable Add to Cart Button

Now to disable the add-to-cart button, go to app/code/Magenticians/Mymodule/view/frontend/templates/catalog/product/view and open the addtocart.phtml file. Now search <?php $buttonTitle = __('Add to Cart'); ?>  and paste the following code just after it:


  • I have added class disablebtn in <div class="actions disablebtn">   which I will use in CSS file.
  • I have added disabled in the button tag to disable the button

And at the end of the addtocart file code, just add <?php endif; ?> .

Your final addtocart.phtml file will look like this:

Now it’s time to create a CSS file. Go to app/code/Magenticians/Mymodule/view/frontend/web/css and create disableaddtocart.css file. Add the following code in it:

Now just update the catalog_product_view.xml by going to app/code/Magenticians/Mymodule/view/frontend/layout/catalog_product_view.xml in order to integrate CSS file. Final catalog_product_view.xml will look like this:

Run CLI Commands

Now open the admin panel of your store and go to STORES → Attribute Set. You will see new attribute DisableAddToCart:

new attribute set

Now click on DisbaleAddToCart and you will see attribute text_add_to_cart:

attribute new

Go to your product edit page and select DisableAddToCart from Attribute Set drop down. Then add the text of your choice which you want to show on a disabled add to cart button:

save product

Now just go to the product frontend page and you will see the desired result:

result add to cart button disable Magento 2

Make Unlimited Customizations to Your Ecommerce Store.

With Cloudways, Deploy Your Magento Store in Minutes and Add as many Customizations to it as you want.

Final Words

Creating hype of the product before its launch can help in getting more sales after its launch. After following this tutorial, I believe that you are now able to disable the add to cart button in Magento 2 store. Still, have any issue or want to discuss anything related to this guide, just leave a comment below!

Subscribe Newsletter

Subscribe to get latest Magento news

Experience Faster
Managed Magento Hosting