Expression Web 4: Creating Master page


In a previous Article Expression Web 4: Importing a CSS Template you learned about how to import the CSS template outside the expression web. Now, I am here to discuss that how you can create a master page using that CSS template and use this master page to create pages. So to know how you can do this, follow the steps below:

  1. Open the previously imported CSS template in Expression Web:

    Expression1.gif
     
  2. From the File menu go to new and click Page, a dialog box asking to Select a new page type will be opened :

    Expression2.gif

    Expression3.gif
     
  3. From the left side list select ASP.NET, again from the middle list select Master page and click "OK":

    Expression4.gif
     
  4. You will see a page opened on your screen named Untitled1.master, save this page and name it to default.master:

    Expression5.gif

    Expression6.gif
     
  5. At this point, you want to build our design into the master page that will be shared throughout our site, and for this just copy the code of the content that you would like to have on each page from the index.html code and paste that code to default.master page.
  6. To show the sample I have copied the Header, footer and the sidebar for my master page. And now my Master page will look like as under:

    Expression7.gif

    Note: you can also change the heading; points etc. according to you but you have to make the changes on the master page only.
     
  7. Now you have a layout that you would like every page of your site to use. However, if you were to start building content pages now, you wouldn't be able to actually enter any content into this layout.
     
  8. Let' create .aspx content pages from master page, Go to file --> new --> create from master page. When you select create from master page a small window appeared asking "select a master page":

    Expression8.gif
     
  9. Click on browse and select default then click open :

    Expression9.gif
     
  10. In your specific master page there is a path for your content page, hit "Ok".

    Expression10.gif
     
  11. You will now get the whole thing of master page that you want to share on your content page, save this page and name it as "Default.aspx":
     
  12. Now you can add the content to the default.aspx page and similarly you will be able to add different pages to your master page:
  13. After adding the content your page should be like this:

    Expression11.gif


Similar Articles