Overriding Native Layout File

The layout can be considered as one of the core components as it represents a webpage design’s structure using an XML file where the user interface control is appropriately displayed. When you want to adjust your webpage with custom extension without messing things up in the Magento Core Files, overriding Native Layout File would be the best option for you in this situation.

Therefore, in today post, I’m going to show you how to override a native layout file in Magento 2.

Override native layout file

On the one hand, to override Magento base layout file, you will need to create a layout file .xml in the location which is mentioned below.

<theme_dir>
  |__/<Namespace_Module>
    |__/layout
      |__/override
         |__/base
           |--<layout1>.xml
           |--<layout2>.xml

After you have located your file, the following layouts will be overriden by the file: <module_dir>/view/frontend/layout/<layout1>.xml <module_dir>/view/frontend/layout/<layout2>.xml

Override theme layouts

On the other hand, to override theme layouts, you can repeat the above step. However, this time your new layout file has to be located in another location, which is:

<theme_dir>
  |__/<Namespace_Module>
    |__/layout
      |__/override
         |__/theme
            |__/<Parent_Vendor>
               |__/<parent_theme>
                  |--<layout1>.xml
                  |--<layout2>.xml

The following files will be overriden: <parent_theme_dir>/<Namespace>_<Module>/layout/<layout1>.xml <parent_theme_dir>/<Namespace>_<Module>/layout/<layout2>.xml

Please remember that your new layout files need to be named the same as the file’s name that you want to override.

Conclusion

Above I have just provided you the overriding Native Layout File method which allows you to adjust nice touches to your webpage without touching Magento Core Files. Hope it would be helpful for you. If you have any questions or new ideas, feel free to leave a comment below.

Enjoyed the tutorial? Spread it to your friends!