Understanding Layout / Design
What are layouts? Every web developer/designer wants to maintain a consistent look and feel across all of the pages within the website. Back in the days, the concept of "Master Pages" was introduced in ASP.NET 2.0 which helps in maintaining a consistent look of the website by mapping it with .aspx pages.
Razor also supports this similar concept with a feature called "Layouts". Basically, it allows you to define a common site template and then inherit its look and feel across all the views/pages on your website.
In nopCommerce, there are 2 different kinds of layouts:
All these 2 layouts are inherited from one main layout called:
_Root.cshtml itself is inherited from
_Root.Head.cshtml is the file you need to look into if you are linked css stylesheet and jquery files (you can add/link more
.js files here). The location of all these layouts in nopCommerce is as follows:
[nopCommerce root directory]/Views/Shared/.... If you are using source code version then:
Layout of _Root.cshtml
_Root.cshtml(in respect of css class)
Now the following 2 layouts override the body of
In this case, there is no change in the layout of the body, so the structure remains pretty much the same as
In this case, there are 2 columns in the body structure: