While working on Magento2, you may need to change the content of the html files of the core modules. Now, as you know, we can not modify in the core files. Then how to change the content of the html file in Magento2. This is possible by overriding the html file in Magneto2.

In this article, we are going to learn the most demanded topic which is to override html in Magento2. In Magento2, to override the html file, there are two ways:-

Example:

Let’s say we want to override  /site_name/vendor/magento/module-checkout/view/frontend/web/template/minicart/content.html

There are two ways to override html files in Magento2:

1. 1. Override html file in Module
   2. Override html file in Theme

1. Override html file in Module

In this method, we are going to override html file in 4 simple but important steps:-

1.1 Create the module

Basically you have to create your own Vendor module, and then create required files module.xml and registration.php file of the module.

1.2 Create requirejs-config.js

To override html file, we need to tell Magento2 about it. This we will need to mention in the requirejs-config.js into MyNameSpace/MyModule/view/frontend/requirejs-config.js

var config = {
    map: {
        '*': {
            'Magento_Checkout/template/minicart/content.html': 'MyNameSpace_MyModule/template/minicart/content.html'

        },
    }
};

1.3 Override content.html

Now create this content.html in app/code/MyNameSpace/MyModule/web/template/minicart/ folder and make necessary changes.

1.4. Deploy new changes

Delete the pub/static to reflect the changes, follow below commands from root directory:

rm -rf pub/static/frontend/* var/view_preprocessed/pub/static/frontend/*

php bin/magento c:f

php bin/magento setup:static-content:deploy


Refresh the page and see your changes.

2. Override html file in Theme

In this method, we are going to override html in the theme.

There are following steps you need to follow :

2.1 Create Theme

Create the registration.php and theme.xml in your site. This is assuming that the theme is already created and applied.

2.2 Override content.html

create this content.html in app/design/frontend/Vendortheme/themename/Magento_Checkout/web/template/minicart/ folder and make necessary changes.

2.3. Deploy new changes

Delete the pub/static to reflect the changes, follow below commands from root directory:

rm -rf pub/static/frontend/* var/view_preprocessed/pub/static/frontend/*

php bin/magento c:f

php bin/magento setup:static-content:deploy


Refresh the page and see your changes.

Conclusion

In this article, we learned about overriding the html files in the module and in the theme. Hope this article will help you in overriding the any html files in Magento2.

If you have any questions, please feel free to comment below. Your feedback is always welcome.