Dot Net Perls

Problem

Use master pages along with code-behind in ASP.NET websites. We must get started learning about powerful ways to use page templates and C# code with ASP.NET 2.0. We need to begin using master pages and code-behind together. We want to use master pages to simplify and ease maintenance of our complex site.

Solution

We must add a master page and then content pages. In the examples, I use the Website project type in Visual Studio. This is recommended as it is a simpler and more streamlined project type. If you are developing a Web Application project, you may need to navigate slightly different menus and dialogs.

What should I put on the master page?

The master page serves as a template for the other content pages on the site. The master page has some code-behind methods, and it could auto-generate the page titles for the pages and some H1 headers for each content page. Here are some likely things you will want on your master page.

• Navigation
  The master page also might contain a TreeView for navigation and a footer with your contact info.
• Styles
  It uses markup for the site layout, and contains some CSS styles and JavaScript code. You can use inline CSS in your master page, for an alternative to an external stylesheet.
• Images or scripts
  Your site's logo is a perfect thing to put in your master page. You can also put code such as Google Analytics (which is implemented as a small piece of JavaScript).

How can I make a master page?

You must go to the Website menu in Visual Studio, and then add a new item. Master Page will appear in that list, so just select it and proceed as normal. You should be familiar enough with Visual Studio to do this quickly.

What is in a master page?

The ContentPlaceHolder markup tag is where content page content is inserted into each page. So, now we want to make some content pages. How do we do that? Now, look at your new master page file. You will see some tags in the master page. One of the most important ones is as follows:

<asp:ContentPlaceHolder ID="MainContent" runat="server" />

How can I make a content page?

Content pages are made in the exact same way that master pages are made. Go to the Website menu, then add new item, and select Web Form. That's MS-speak for "Content Page". Check the "Select Master Page" checkbox, and finally select your master page.

What's in a content page?

Next I want to show you an example of a content page and walk you through some parts of it. You should have a content page now and it will have some special markup in it. It will contain several lines of markup similar to the following.

<%@ Page Language="C#" MasterPageFile="~/DotNetPerls.Master" Title="Untitled Page" %>

<script runat="server">

</script>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" Runat="Server">
</asp:Content>

• What's the ID?
  The ID is Content1, and it is very important when using the content page with the specified master page.
• ContentPlaceHolderID
  The ContentPlaceHolderID is "MainContent". It must match the ID="MainContent" part of the ContentPlaceHolder tag in the Master Page.
• Always remember runat="server"
  As always, you must add runat="server", which indicates that this tag will be "run" on the server before being sent to the browser.

How can I use them together?

In the master page, you can change various elements picked up from content pages in the code-behind. The master page transforms itself and takes on the properties of the content pages. Then, you can use code in the master pages to change parts of the master page that were retrieved from the content pages.

using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Web;
using System.Web.UI;

public partial class _Default : MasterPage
{
    // This code belongs in the *master.cs file. You can usually open this
    // by clicking on the little + box next to your *.master file.
    protected void Page_Load(object sender, EventArgs e)
    {
        // Using code-behind, we can modify each page's title according to logic.
        // Let's say you want each title on your site to have the words "Your Site: "
        // at the start. Try out the following code, and put regular page titles
        // in the content pages.
        this.Page.Title = "Your Site: " + this.Page.Title;
        // This will turn "Content Page Title" into "Your Site: Content Page Title"
        // on every content page.
    }
}

Conclusion

You can dynamically generate pages, leading to fewer typos, with less content to manage. The master page, content page and code-behind model can simplify and streamline your site. Code-behind can separate complex logic from page markup. Finally, here are a couple ideas for using master pages:

• Set headings in every document
  You could easily generate an H1 header for each page based on the Content Page's title. This is useful for making the page title always equivalent to the header.
• Meta tags
  For SEO purposes, adding meta tags could be important. Code-behind allows you to add meta tags programmatically, on master pages.

Ads by The Lounge