Master Page and Content Pages In ASP.NET
Master pages are very useful when you have common content to display for all pages or some pages in your website like if you have common header for all user pages and common header for all admin pages, then you can use Master Page concept.
Master Page contains the common layout of all content pages.
Here I am taking simple example.
If you want to display all your pages with background color as yellow and font color as red. Then you need not apply these styles for every page in your website, just apply colors to your master page and use master page for every content page in your site.
To create master page, Right click on Solution explorer and select Add New Item, from all items select Item which has extension master and name it as header.master (you can give your own name).
The code of master page contains the background color as yellow and some content on the left of the page with font color as red and some content on the right of the page with font color as blue.
header.master
<%@ Master Language="VB" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> </script> <html xmlns="http://www.w3.org/1999/xhtml" > <head id="Head2" runat="server"> <style type="text/css"> body { background-color:yellow; } .leftside { float:left; color:red; } .rightside { float:right; color:blue; } </style> <title>Master Page Example</title> </head> <body> <form id="form2" runat="server"> <div class="leftside" > <asp:contentplaceholder id="ContentPlaceHolder1" runat="server"> This is the left side of the master page </asp:contentplaceholder> </div> <div class="rightside" > <asp:contentplaceholder id="ContentPlaceHolder2" runat="server"> This is the right side of the master page </asp:contentplaceholder> </div> </form> </body> </html>
If you observed the above code, you can find that all the tags are common except Master directive and contentplaceholder control.
Master directive describe that page is master page and in the place of contentplaceholder control contenet page content merged which includes this particular contentplaceholder .
The content page code which includes this master page (header.page) as follows.
Default.aspx
<%@ Page Language="VB" MasterPageFile="~/header.master" Title="Untitled Page" %> <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> This is the content page merged with the Master Page </asp:Content
If you observe above code, you can find MasterPageFile which describes master page path. There is no any standard XHTML tag in the content page because all tags are included in the master page itself.
The new Asp.Net control is content controls where you can place your content for particular page. It merged it’s content in master page contentplaceholder based on ContentPlaceHolderID i.e, the ContentPlaceHolderID of this conent is ContenetPlaceHolder1 which is ContentPlaceHolder in the master page. That means all content which is included in this content control will merged in the ContentPlaceHolder of id ContentPlaceHolder1.
In master page we have two contenetplaceholder with some content. In Content page if you want to change the master page content,you just override the content by including particular contentplaceholder for content control.
In our content page we overrides the ContentPlaceHolder1 content by including it in content page control like below.
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> This is the content page merged with the Master Page </asp:Content>
So when page executed, content page overrides the ContentPlaceHolder1 content because we included it in our page, and for ContentPlaceHolder2 it displays the master page content because we didn’t included it in our page.
In this way we can use master page for common layout in our pages.
Instead of including the master page in each and every page, we can register this master page in web.config file for all pages in our application.
The code to register master page in web.config file:
<configuration> <appSettings/> <connectionStrings/> <system.web> <pages masterPageFile="~/header.master"> <namespaces> </namespaces> </pages> </system.web> </configuration>
The master page which we registerd in web.config ill applied to only to content pages. If a page does not include any Content controls, then this master page will not applied for that page, it is like normal ASP.NET page.
Download source code here
