Slide 1

what is layout

Most web apps have a common layout that provides the user with a consistent experience as they navigate from page to page. The layout typically includes common user interface elements such as the app header, navigation or menu elements, and footer.

Common HTML structures such as scripts and stylesheets are also frequently used by many pages within an app. All of these shared elements may be defined in a layout file, which can then be referenced by any view used within the app. Layouts reduce duplicate code in views.

Slide 2

By convention, the default layout for an ASP.NET Core app is named _Layout.cshtml. The layout files for new ASP.NET Core projects created with the templates are:

• Razor Pages: Pages/Shared/_Layout.cshtml

• Controller with views: Views/Shared/_Layout.cshtml

Slide 3

Specifying a Layout

Razor views have a Layout property. Individual views specify a layout by setting this property:

 @{
     Layout = "_Layout";
 }

The layout specified can use a full path (for example, /Pages/Shared/_Layout.cshtml or /Views/Shared/_Layout.cshtml) or a partial name (example: _Layout). When a partial name is provided, the Razor view engine searches for the layout file using its standard discovery process. The folder where the handler method (or controller) exists is searched first, followed by the Shared folder. This discovery process is identical to the process used to discover partial views.

By default, every layout must call RenderBody. Wherever the call to RenderBody is placed, the contents of the view will be rendered.

Slide 4

Uses of layout

In ASP.NET Web Pages, you can define a layout page that provides an overall container for pages on your site. For example, the layout page can contain the header, navigation area, and footer.