This topic contains a step-by-step illustration of solving a typical design customization task using Magento 2 templates.
This topic discusses the main concepts of how default templates work in the Magento 2 application. The following topics are covered: How templates are initiated, Root template, Conventional templates location, Templates overriding, Getting argument values from layout.
Set your Magento 2 application to the developer mode. The application mode influences the way static files are cached by Magento. The recommendations about Magento2 theme development we provide in this chapter are developer/default-mode specific.
To improve security and ease-of-use, Magento 2 added a command that switches Magento modes from developer to production and vice versa.
To ensure stability and secure your customizations from being deleted during upgrade, do not change out-of-the-box Magento module and theme layouts. To customize layout, create extending and overriding layout files in your custom theme.
Rather than copy extensive page layout or page configuration code and then modify what you want to change, in the Magento system, you only need to create an extending layout file that contains the changes you want.
For a Magento 2 particular page, its layout is defined by two major layout components: page layout file and page configuration file.
Changing layout files is one of the two possible ways to customize page layout in Magento 2 (the second way is altering templates). To change the page wireframe, modify the page layout files; all other customizations are performed in the page configuration or generic layout files.
Magento 2 application implements the Model-view-controller architecture pattern; meaning, the Magento 2 software is architected into layers, including the view layer.
When you create a Magento 2 theme, you might need to create override files for default theme and module view files. To do so, you must determine which template, layout, and style files Magento uses. This topic describes how to do this.