Creating Templates

A template defines the layout and design of the subsequent pages you will create from it. In this lesson, the template you create provides the navigation, the site identity, and the look and feel of the teacher profiles section in the Yoga Sangha project site.

When creating a template, your first step usually includes the development of the page designwhich has already been done for you in this project. The teacher.html document has the structure, layout, and navigationit contains everything except for the contents that will be defined in pages based on the template you create from this page.

In this lesson, you'll create a series of Web pages from a common template, each profiling a different teacher. You'll begin the process in this exercise by using an existing page to create the template and then create other pages from that template in subsequent exercises.

1.	Open teacher.html from the Lesson_13_Templates/Teachers folder. In this document, the materials that would be placed in the content areas and that are intended to change from page to page are represented by descriptive placeholder text.
2.	Choose File > Save As Template. The Save As Template dialog box opens. You can select the site in which you want to save the template. For this project, you should save it within the Yoga Sangha site. Dreamweaver automatically names the template teacherthe name of your file. For this exercise, use this automatic name. It accurately describes the purpose of the template. Note If you want to change the name of the template, type the new name in the Save As text field. The template name is for reference by you and your team onlyit will not be known to the visitors of your site. Try to use names for your templates that are as descriptive as possible. This page has now been saved as a template, and you can use it to build other pages later in this lesson.
3.	Click Save to close the dialog box. Click Yes when Dreamweaver displays an alert box that asks Update Links? Updating the links will allow Dreamweaver to keep the paths to links and images correct. Your template has been added to your site and saved in the Templates folder with an extension of .dwt. Dreamweaver automatically adds the Templates folder if one doesn't already exist. You might need to click the Refresh button on the Files panel to see the Templates folder. Leave this file open to use in the next exercise. The file you are working with is now teacher.dwt, and the top of the Document window displays <<Template>> (teacher.dwt).
4.	Click the Assets tab in the Files panel group and click the Templates button.

Note

Because you have a template open, teacher.dwt, the Assets panel may open the Templates category automatically.

The Assets panel is now open to the Templates category. The template you just created appears in the list, and any future templates you create in this site will also appear here. When a template is selected in the list, a portion of that document will appear in the preview area at the top of the panel.

Note

Instead of saving a page as a template from one that was already created, as you just did, you can also create a new blank template by clicking the New Template icon at the bottom of the Templates Assets panel. A new untitled template is added to the list of templates in the panel. While that template is still selected, enter a name for the template. Alternatively, you can create a template from scratch by choosing Template Page from the Category list in the General portion of the New Document dialog box. The Templates tab of the New Document dialog box is for creating pages based on already existing templatesit does not allow you to create new templates.