Technology Serving Learning Institute Summer 2008 |
Missouri State University
Task: Creating and Modifying Dynamic Web Templates
- In SharePoint Designer 2007, open a new page using the
File | New | Page... or by clicking on the New Page Icon.
- Type "Class Name" or the name of class you teach at
the top of the document and hit enter to start a new line.
- Save your file as temp_home.dwt using File | Save
As... and select Dynamic Web Template as the file type.
- Then insert an interactive button selecting Insert |
Interactive Button... from the menus at the top of the screen with your
cursor inside the paragraph below Class Name. The following dialog box will
- Now change the text to Home and the link to
temp_home.htm as shown in the image below.
- Then click after the first button and create a second
button named Class Content with the settings as indicated below.
- After these two buttons have been created, hit enter
with your cursor after the second button to create a new blank line.
- Now save your file again. You will be prompted to
save embedded images. You can choose the folder that you wish to use by
clicking on "Change Folder..." or just click OK.
- Now go to Format | Dynamic Web Template | Manage
Editable Regions... with your cursor in the blank line below the buttons you
You will see the following dialog box.
- In the Region name: enter the following text: Page
Content and select Add as shown below. Then select Close.
- Save your document again and close it.
- Now select File | New... | Create from Dynamic Web
Template... and in the dialog box that appears select temp_home.dwt and
- You should now see the file that you have created with
all but the (Page Content) area grayed out. This is the only part of this
page that you can edit. Any changes to the grayed out area will need to be
made in the Dynamic Web Template file and will affect all files based on
- Type Home Page into the Page Content area and save the
file as temp_home.htm Then close this page also.
- Open another new file with the temp_home.dwt
template. Enter Class Content where it says Page Content, save it as
temp_cont.htm, and close the page also.
- Now reopen temp_home.htm and select the Preview in
You can then select the Class Content button to move to that page and then
the Home button to move back again. Close your web browser and let's make
one change to the existing template to show how it will change both of the
pages we have created.
- To do this, open the temp_home.dwt file in SharePoint
Designer 2007. Then select the Home button and right-click and select
button properties. Then change the button to green by selecting "Border
Bottom 2" as shown below. Then click OK.
- Now save the file. You will be prompted to overwrite
the images for the old button with the images for the new button as show
below. Select OK.
You will then be prompted to update documents based on this template.
After updating, SharePoint Designer 2007 will display the following
confirmation box which will display the number of files that were updated to
reflect the changes made to the template.
- Now you can go back and view your web pages again
following step 16. Make sure you open the temp_home.htm and not
temp_home.dwt since this file is not viewable in a web browser, but is used
to create other pages.
- Obviously this is an simplified example, but it should
show you how to create and use dynamic web templates. Let's discuss how we
might use these to improve class websites.
This page is
work done by Kevin
Dickson, a Facilitator in the
Winter 2008 TSL Institutes.
© Copyright 2008, Southeast Missouri
Comments, suggestions, and questions regarding this site? E-mail Michael
L. Rodgers at email@example.com