Creating Master
Page:
·
Open Visual Studio.
·
Create new ASP.NET Web
site, enter name as MasterPagesApp.
·
Select Location as File System, and enter the path as D:\MyWebSites\MasterPagesApp (or
any other path).
·
Select the Language which you
are comfortable, for this I used C#.
·
After creating the new Web Site, you will find a page created for
you named Default.aspx.
·
Delete this page and right click the application from solution
explorer. Select Add New Item,
select Master Page from installed
Visual Studio templates and name it MainLayout,
and check the Place code in separate
file checkbox; this will create you a code-behind in the language you
select, we work here using C#.
The MainLayOut.master will be open in Source
view. You will find this master page
directive at the beginning:
<%@
Master AutoEventWireup="true"
CodeFile="MainLayOut.master.cs" Inherits="MainLayOut"
Language="C#" >
As you
see, the attributes of the Master directive is common to the ones of the Page
directive, and they are self-descriptive.
·
CodeFile is the path of the code behind file and it can be VB or
C#, note that in one Web Site you can mix between both languages.
·
Inherits decides the class within the code file to be used.
·
Language is the language of the code behind file.
·
AutoEventWireup is so important; for any page there is an
automatic way to bind the events to methods in the same aspx file or in code
behind. If this attribute is true, Page
events are automatically bound to methods that are using naming convention as
Page_event. For example Page_Load,
Page_Init, and Page_PreInit (this is the event fired before creating the
controls of the page). This is one
disadvantage that the standard events of the page should adhere to this naming
convention, but if you set it to false, it will give you more flexibility to
use any names for the event handlers. in VB.NET.
See
ContentPlaceHolder section:
<asp:contentplaceholder
id="ContentPlaceHolder1" runat="server"> </asp:contentplaceholder>
This server control is the most important for the master
pages as this is the zone in which the content pages will be rendered.
Next, do the following:
·
Switch to the Design of the master page, you will
get the ContentPlaceHolder1 shown, now you can design the master page just as
any aspx page, so for this practice we'll do a simple master page.
·
From Layout menu select Insert Table, Select
Template option, then select Header, footer and side, then drag the
ContentPlaceHolder1 control into the right middle cell of the table you have
just added.
·
Add one label into the left middle cell, and the
logo of CodeProject to the upper cell of the table, you should have the same as
in the following figure
·
Double click anywhere at the master page. This
will open the code behind and will add the Page_Load event handler and write
the following code:
Label1.Text
= "The Time of Server is: " + DateTime.Now.TimeOfDay;
The above code will show the time of the server at the label.
Creating Content Page:
You should know that the content page is just one aspx page,
but you bind this page to one master page while you are creating it. To do this, right click your web application
from solution explorer and select Add New Item, select Web Form from the
installed templates and check Select Maser Page, enter the name of the new page
as myContentPage.aspx.
The page you have just added will open in source view and you
will find one entry. Add the
MasterPageFile attribute set to the value of the master page file you have
selected before. You will also find one
Content server control added by default and the attribute ContentPlaceHolderID
assigned to ContentPlaceHolder1. This is
the default value which refers to the ContentPlaceHolder control at the master
page and if you have renamed this control at the master page, you should change
it now to the correct ID. This sets the
zone in which this content page will be shown as we said before.
Switch to the design view of MyContentPage.aspx. You will get all the master page contents
added by all the contents of the master page is dim because they are not
editable, only the Content1 will be enabled if you click the white area, and
you can now add any controls just as you do for any aspx page.
Double click the white area of Content1, you will get the
event handler of Page_Load, add the following code:
Label1.Text
= this.MasterPageFile;
The above code will show the path of the Master
Page file in the label.
Saving Master Page path in web.config:
There is one technique by which we can make all
the pages comprising our web application as content pages and we can bind all
the pages to one master page, this master page that will be a template to our
entire application. It is advisable to
save the path of this master page in web.config that we can do as following:
<configuration>
<pages
masterpagefile="~/sitetemplate.master">
</configuration>
If you specify a MasterPageFile for your page, it
will override your web.config value but the importance of the value of
web.config is that it guarantees that all the pages added to your application
are bound to this master page file. So,
if you have more than one master page, you can just change the web.config
value, and this will update the whole application pages with no need of
recompilation.