Customizing a Dreamweaver template

1. In Dreamweaver: File, New, Blank Template
   1. Template type= html template
   2. Select a layout that you like – the number of columns, headers/footers if desired, fixed, hybrid, or liquid, etc.
   3. Then, over on the right side of the screen, select Layout CSS: New File .
   4. Select the Create button and save the css with a name and location you use for your css files
2. Modify the css (now in a separate file) to get the colors / banner that you want to use, the size of the different areas you need, etc.
3. Plan how you're going to use include files (for navigation or banner, or static text, or footers or sidebar links or all of the above) and put these placeholder lines into the template in the correct area. (syntax is:
   <!--#include virtual="/webclass/yourname/includes/menu.html" --> NOTE: NO SPACE HERE: <!--#include
4. Now Save as a template in Dreamweaver (File, Save As Template).
5. Now add Editable Regions to your file, making sure to exclude #include lines and <div> labels.
   1. Select the entire area between the divs, and then select Insert, Template Objects, Editable Regions.
   2. Name the region so you'll recognize it.
   3. Repeat a, b to do all the editable areas of the template.
6. Then to make a page for your new site, in Dreamweaver say File, New, Page From Template, add content and save as .shtml to your web folder and then ftp it to the site!
7. Repeat steps 1-4 for additional layouts, all of which should use the same css.

See full-size picture of this screenshot