Scribd
Upload
83 views

Unit 5 - Master Pages & Themes1

Master pages in ASP.NET allow you to define common layout and design elements that can be shared across multiple pages. A master page contains placeholders where individual content pages can supply their specific content. When a content page is requested, it merges with the master page to produce the final output by combining the master page layout with the content from the content page. Master pages help avoid duplicating common elements on every page and allow changing the look and feel site-wide by modifying a single master page.

Uploaded by

dhruv shah
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
83 views

Unit 5 - Master Pages & Themes1

Master pages in ASP.NET allow you to define common layout and design elements that can be shared across multiple pages. A master page contains placeholders where individual content pages can supply their specific content. When a content page is requested, it merges with the master page to produce the final output by combining the master page layout with the content from the content page. Master pages help avoid duplicating common elements on every page and allow changing the look and feel site-wide by modifying a single master page.

Uploaded by

dhruv shah
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 17

Master Pages & Themes

UNIT - 5
Master Page
 ASP.NET master pages allow you to create a consistent
layout for the pages in your application.
 Single master page defines the look and feel and standard
behavior that you want for all of the pages (or a group of
pages) in your application.
 You can then create individual content pages that contain the
content you want to display.
 When users request the content pages, they merge with the
master page to produce output that combines the layout of the
master page with the content from the content page.
 A master page defines both the static page layout and the regi
ons that can be edited by the ASP.NET pages that use 
the master page. 
Master Page
 These content editable regions are indicated by ContentPlaceH
older control, which can be seen within the content <div>
 Our master page has a single ContentPlaceHolder (MainConte
nt), but master page's 
may have multiple ContentPlaceHolders.
 The @ Master directive defines it as a master page.
The master page contains a placeholder tag for individual
content.
 The id attribute identifies the placeholder, allowing many
placeholders in the same master page.
 The master page can also contain code, allowing dynamic
content.
 <%@ Master Language="VB" AutoEventWireup="true" 
CodeFile="Site.master.vb" Inherits="Site" %> 
 <asp:contentplaceholder id="MainContent"  runat="server"> 
Master Page
 In Content Page,
 @Page directive there's a reference to the master page file use
d (MasterPageFile="~/Site.master"), and 
the ASP.NET page's markup contains a Content control for each
 of the ContentPlaceHolder controls defined in the 
master page, with the control's ContentPlaceHolderID mapping t
he Content control to a specific  ContentPlaceHolder. 
 Content control is where you place the markup you want to app
ear in the corresponding ContentPlaceHolder. 
 <%@ Page Language="VB" MasterPageFile="~/Site.master" 
AutoEventWireup="true" CodeFile="Default.aspx.vb" 
Inherits="_Default" Title="Untitled Page" %> 
 <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" 
Runat="Server"> 
//content
</asp:Content> 
Master Page
Requirement Of a Master Page
 The master pages can be used to accomplish the following:
 Creating a set of controls that are common across all the web
pages and attaching them to all the web pages.
 A centralized way to change the above created set of controls
which will effectively change all the web pages.
 Dynamically changing the common UI elements on master
page from content pages based on user preferences.
MASTERPAGE

 The extension of MasterPage is '.master'.


 MasterPage cannot be directly accessed from the
client because it just acts as a template for the
other Content Pages.
 In a MasterPage we can have content either
inside ContentPlaceHolder or outside it. Only
content inside the ContentPlaceHolder can be
customized  in the Content Page.
 We can have multiple masters in one web
application.
 A MasterPage can have another MasterPage as
Master to it.
MASTERPAGE
 The content page content can be placed only inside
the content tag.

 Controls of MasterPage can be programmed in the


MasterPage and content page but a content page
control will never be programmed in MasterPage.

 A master page of one web application cannot be


used in another web application.
MASTERPAGE
 The MasterPageFile property of a webform can be
set dynamically and it should be done either in or
before the Page_PreInit event of the
WebForm. Page.MasterPageFile =
"MasterPage.master". The dynamically set Master
Page must have the ContentPlaceHolder whose
content has been customized in the WebForm.
 The order in which events are raised: Load
(Page) a Load (Master) a LoadComplete
(Page) i.e. if we want to overwrite something
already done in Load event handler of Master then it
should be coded in the LoadComplete event of the
page.
EXAMPLE:

 Adding a MasterPage to the Project


 Add a new MasterPage file (MainMaster.master) to
the Web Application.
 Change the Id of ContentPlaceHolder in <Head> to
"cphHead" and the Id "ContentPlaceHolder1" to
"cphFirst"
 Add one more ContentPlaceHolder (cphSecond) to
Master page.
 To the master page add some header, footer and
some default content for both the content place
holders.
CONTENTPLACEHOLDER
 <form id="form1" runat="server">
Header...<br />
<asp:ContentPlaceHolder id="cphFirst" runat="server">
                This is First Content Place Holder
(Default)
</asp: ContentPlaceHolder>
<br />
<asp:ContentPlaceHolder ID="cphSecond" runat="server">
This is Second Content Place Holder (Default)
</asp:ContentPlaceHolder>
<br /> Footer...
</form> 
CONTENTPLACEHOLDER
 To the web application add a WebForm
(Default.aspx) a Check (Select Master Page) in
New Item Dialog
 Note the attribute "MasterPageFile" in @Page
directive of the WebForm.
 Delete the <content tag for the
ContentPlaceHolderId="cphSecond".
 Run the WebForm - The output rendered includes
the Header, Footer, Content of cphSecond in
Master and the content of <content tag for
ContentPlaceHolderId="cphFirst" in webform.
 Here we understood the importance of
ContentPlaceHolder in Master and Content in
WebForm.
 Add a Label in the master page (outside
ContentPlaceHolder)

<asp:Label ID="lblMaster" runat="server" Text="In Master"/>
 Add a Button to WebForm (inside content tag)

 <asp:Button ID="btnDemo" runat="server" onclick="btnDemo_Click" 
Text="Set Label of Master" />
 Handle the Click event of above button and add to it
the code as mentioned below.

protected void btnDemo_Click(object sender, Event
Args e)
{
      //Get reference to Label control (lblMaster) in
the master page.
      Label lbl =
(Label)Master.FindControl("lblMaster");
      lbl.Text = "From WebForm Page...";
} 
 Run the WebForm and Click on Button to see that
the text in master page Label has changed.
 To the class in MainMaster.master.cs add the
following property.

public Label MasterLabel
{
       get { return lblMaster; }
     } 

 To the Default.aspx add the following

<%@ MasterType 
VirtualPath="~/MainMaster.master" %>

Replace the existing code in btnDemo_Click with


the following.

//To set Text of Label in master page using the public property
MasterLabelMaster.MasterLabel.Text = "From
WebForm";
  //The above line would work only if <
%@MasterType Directive is added to current page

You might also like