After being tasked with understanding Masterpages and ContentPlaceHolders in ASP.NET 2.0, I had this weird need to explain it to people because I think it is a pretty neat concept. Luckily, I had this web site documents thing where I could lay it out the way I understand it so far, and update it as necessary as I learn more.
The Master Page - The master page for a website is just that. It is the main page that will be displayed in the site after it has been created. However, it can not be displayed directly! You can't go to http://www.davidj.org/MasterPage.Master and expect to see anything. The master page is more like a filter through which all pages are pushed.
The Master Page Layout - As a very bad example, think of a frameset. Ewww. I know. But just to get the
picture, okay?
This master page layout has a header, a footer, a menu
section and a main section. Hopefully, it is pretty
self-evident what these sections are. They are defined in the file MasterPage.Master as
<asp:ContentPlaceHolder ID="Header"></asp:ContentPlaceHolder>.
So in the case of figure 1 you would have
<asp:ContentPlaceHolder ID="Header"></asp:ContentPlaceHolder>,
<asp:ContentPlaceHolder ID="Menu"></asp:ContentPlaceHolder>,
<asp:ContentPlaceHolder ID="Main"></asp:ContentPlaceHolder>,
<asp:ContentPlaceHolder ID="Footer"></asp:ContentPlaceHolder> to
make up your four sections.
Table-Based Layout - Although I totally recommend using CSS for layout, and those of you who know me know I do, we are going to use a table for layout with the Master Page
so that everybody can understand. The html around the content place holders is going to look something like this:
<table>
<tr>
<td colspan="2"><asp:ContentPlaceHolder ID="Header"></asp:ContentPlaceHolder></td>
</tr>
<tr>
<td><asp:ContentPlaceHolder ID="Menu"></asp:ContentPlaceHolder></td>
<td>asp:ContentPlaceHolder ID="Main"></asp:ContentPlaceHolder></td>
</tr>
<tr>
<td colspan="2"><asp:ContentPlaceHolder ID="Footer"></asp:ContentPlaceHolder></td>
</tr>
</table>
Set The Footer - Let's say that we are always going to have the same thing in the footer. Supposing it is going to be a
copyright notice and a link to the webmaster. Because it is always going to be the same thing, we can put it in the master page directly.
And now our html with table layout and standard footer looks like this:
<table>
<tr>
<td colspan="2"><asp:ContentPlaceHolder ID="Header"></asp:ContentPlaceHolder></td>
</tr>
<tr>
<td><asp:ContentPlaceHolder ID="Menu"></asp:ContentPlaceHolder></td>
<td>asp:ContentPlaceHolder ID="Main"></asp:ContentPlaceHolder></td>
</tr>
<tr>
<td colspan="2">
<asp:ContentPlaceHolder ID="Footer">Copyright 200X Mailto:Webmaster</asp:ContentPlaceHolder>
</td>
</tr>
</table>
Yes, there is more to the mailto link and stuff but let's just focus on the Master Page!
Set the Menu and the Header - You know, come to think of it, lets say the menu and the header section are always the same as well!
And now our html with table layout and standard footer looks like this:
<table>
<tr>
<td colspan="2"><asp:ContentPlaceHolder ID="Header"> Fred's Master Page Header </asp:ContentPlaceHolder></td>
</tr>
<tr>
<td><asp:ContentPlaceHolder ID="Menu">Item - Item - Item</asp:ContentPlaceHolder></td>
<td>asp:ContentPlaceHolder ID="Main"></asp:ContentPlaceHolder></td>
</tr>
<tr>
<td colspan="2">
<asp:ContentPlaceHolder ID="Footer"> Copyright 200X Mailto: Webmaster </asp:ContentPlaceHolder>
</td>
</tr>
</table>
Notice that the only thing that doesn't have content is the Main section.
Content Pages - Now that you have a master page by which all must pass, it is time to build content pages. Content pages
do not have to be standard html with head and body. They only have to contain the ID of the section on the master page that they will be filling. A popular
content page among all websites is the default page. Our default content page will say "Welcome to Fred's Master Page Website!". This is done by using
the asp:Content tag. The file default.aspx only has to contain:
<asp:Content ID="Content1" ContentPlaceHolderID="Main" runat="Server">Welcome to Fred's Master Page Website!</asp:Content>
The asp:Content attribute ContentPlaceHolderID tells the master page to put it in the ContentPlaceHolder called Main.
Because the file default.aspx does NOT reference the other sections in the master page, the master page delivers its defaults for header, menu and footer.
Overwrite the footer - Overwriting the footer in the default.aspx page would be done by:
<asp:Content ID="Content1" ContentPlaceHolderID="Main" runat="Server">
Welcome to Fred's Master Page Website!
</asp:Content>
<asp:Content ID="Content1" ContentPlaceHolderID="Footer" runat="Server">
Fred's New Footer
</asp:Content>
which would make the page appear as:
The whitish sections are where the content page is overwriting the master page.
Hopefully this has helped you get up to where I am at with Master Pages. As I learn more, I will put it here.