In this tutorial, you will learn how to create a master layout within a Umbraco CMS website. Master layouts are an important part of building any .NET site. Without layouts, you will have to duplicate all the HTML required to render the header and the footer within every page view. This means that if you want to design beautiful well-crafted websites, you will need to master this topic, so read on to learn more 🔥🔥🔥
Creating The Master View
The good news is that if you already know how to create a master layout in normal .NET, you already know everything you need to know in order to render a partial within Umbraco CMS. The most efficient way to configure Umbraco to use a master layout is to create a _ViewStart.cshtml
file. This file will automatically render a layout of your choice whenever any page is requested. The alternative option is to manually set the layout in each page view. This approach is sub-optimal as it leads to a lot of duplication and requires coding effort. 😞
To create a _ViewStart.cshtml
create a file within your View
folder called _ViewStart.cshtml
Within _viewStart
you need to create a pointer to the file that the system will use as your default layout:
Next, you need to create a default layout. Within:
Views
âž¡ Shared
Create a new view called _Layout.cshtml
. In this layout view, you are then free to add any HTML you require. In my example, I'm going to continue on from this tutorial. I will create a layout that references my header partial:
If you do not want to use a view start, you can also reference a layout from within a view like this:
With this code defined, when a page request is made, the MVC pipeline will combine all the different elements together in order to render the page with the layout. Happy Coding 🤘