Dreamweaver Templates Make Web Development A Breeze

Whenever the computer training company I work for runs Dreamweaver training courses, we always ensure that the topic of templates is included. They are such a great time-saving feature. Templates can be used in two ways: firstly, a new page can be based on a template and, secondly, a template can be applied to an existing page. To create a new page based on a template, proceed as follows.

Whenever the computer training company I work for runs Dreamweaver training courses, we always ensure that the topic of templates is included. They are such a great time-saving feature. Templates can be used in two ways: firstly, a new page can be based on a template and, secondly, a template can be applied to an existing page. To create a new page based on a template, proceed as follows.

1. Choose New from the File menu.

2. Click on Blank Template, in the first column of the New Document window.

3. In the second column, choose the “Page Type” you would like to create (HTML, ASP, ASP.NET, ColdFusion, JSP OR PHP).

4. In the third column, marked “Layout”, you may optionally choose one of Dreamweaver’s excellent CSS layouts.

5. Finally, in the fourth column of the New Document dialog, specify whether you would like your CSS code placed in the head area of the template, in a new CSS file or in an existing CSS file. (Naturally, this option only applies if you choose to use one of the preset CSS layouts.)

If you wish to apply a template to an existing page, perform the following steps.

1. Open the page in question.

2. Choose Modify – Templates – Apply Template to Page.

3. Double-click the name of the template you wish to associate with the page.

Dreamweaver templates use a system of editable regions to mark areas of the page which may be modified whenever the template is used. Editable regions may contain placeholders such as text or graphics. Graphic placeholders are ideal for marking an area of a page where an image is to be inserted. Each time the template is used, a different image can be substituted for the placeholder. To replace a graphic placeholder, do the following.

1. Create or open a page based on a template.

2. Double-click the graphic placeholder.

3. Navigate to the image which will replace the placeholder.

4. Double-click the name of the image.

The name of the template controlling a page is displayed in the top right and the name of each editable region is shown above the appropriate area of the page. The editable region labels compromise the WYSIWYG display of your page slightly by pushing elements down. To switch off the display of template and editable region names, choose View – Visual Aids – Invisible Elements. Use the same command to reinstate them.

Dreamweaver normally places a light blue rectangle around editable regions in both templates and documents based on them. It also places a yellow rectangle around any page based on a template. The same yellow highlight also shows up in code view to mark the locked regions of a page based on a template. Dreamweaver allows you to change these highlight colours.

1. Choose Preferences from the Edit menu.

2. Click on the category heading Highlighting on the left of the window.

3. Choose a colour from the pop-up palettes next to Editable regions and Locked Regions

From time to time, you will have pages which you need to treat as independent and which you do not want controlled by a template. Obviously, you can simply avoid attaching a template to such pages. However, you will often find it useful to apply a template to the page, to obtain formatting elements and then to detach the page from the template. To detach a page from its template, choose Modify – Templates – Detach from Template.

If you have the Assets panel open, you can also update the current page by dragging the appropriate template icon from the Templates section onto the page. This technique can also be used to apply a template to a page or to change the template on which a page is based.

To learn more about Dreamweaver training courses, visit Macresource Computer Training, an independent computer training company offering Dreamweaver training courses in London and throughout the UK.

Leave a Reply

Your email address will not be published. Required fields are marked *