Establishing a Consistent Look-and-Feel with Master Pages

This topic details how to use Master Pages to give your Mobile RPG Application a consistent visual style.

The MasterPage.Master file (generated as part of each new Mobile RPG project in Visual Studio) works with each .aspx display file, which has defined divisions identified with ContentPlaceHolderIDs, each using the same id as the corresponding division in the master page it's associated with. When the Content Page is requested, it is merged with the Master Page combining the layout and styling of the Master Page with the content from the Content Page.

Changing the master page thus changes the appearance of the entire application. Some of the easiest and most profound changes you can make include:

• Change the Title

  The title defaults to the example provided with the installation. You can locate the title in MasterPage.master and change "Carolina" to your company name.

  <Title>Your Company Name Here</Title>

  You may also wish to change the Headline and Tagline to match your company name and motto here:

  <div id="branding">
  	<h1 id="headline" class="ir">Your Company Name Here</h1>
  	<p id="tagline">Your slogan or tagline here</p>
  </div>

• Change the Logo

  A sample logo image is provided with the installation. This logo image, App_logo.png, can be replaced with your logo or you can add a new image and then change the image reference in MasterPage.master. The image reference in MasterPage.master is shown below. If you create a new file you will need to change the ImageUrl to match the location and file name of your logo image.

  <asp:Image style="float:left;margin-top:30px" ID="Logo" runat="server" ImageUrl="~/Themes/Current/Images/App_logo.png" />