Changes in Dreamweaver 8 Templates

I've seen a few confused posters on the various Dreamweaver forums since the release of Dreamweaver 8 that relate to templates. These templates were created in Dreamweaver MX or Dreamweaver MX 2004 and now they're not acting/updating the same. Jesse Rodgers, from University of Waterloo, and were trying to figure this out today. I had ran into a similar situation to the one he was dealing with with one of my personal sites.

The issue stems from the fact that DW MX and DW MX 2004 let us be sloppy. If we linked to our CSS in the template using this syntax – href="scripts/local.css" DW said, "Hmmm, I'm sure they don't really want to link to a folder and file within the Template directory, so I won't change the path of this link." And it worked perfectly for me. I took advantage of this by creating links to site assets this way when I wanted the item I was linking to, to actually be in the directory the child file was saved into.

A perfect example is my KS Pope site. This client wanted each directory to have a different color and picture. I put the CSS files for the basic structure of each page into the script directory in the root and all XHTML documents link to that. The template link was written – href="../scripts/structure.css" and when the file was saved, it showed up linked into the scripts directory in the root. However, each directory also had a scripts directory within it, where I placed the local CSS file that brought in the color and individual picture for each directory. I was very happy in my ignorance.

And then I needed to update the site with DW 8. Oh my. Suddenly, all my pretty colors are gone and on viewing the code for the child pages, I see – href="../Templates/scripts/print.css". Defintely not what I had in mind. On discussing this with people at Macromedia that understand the changes, Jesse and I found the following — shared with you to save you hair-pulling and other mindless madness.

You can use template expressions or template parameters to keep DW from changing your link paths. This applies to includes, CSS, images and links (anchors). I'll paste the info in below. Hope this helps!

For INCLUDES

1. Without using template parameters:
   1. Simply change double quotes to single quotes for the include file path. This only works for ASP and .NET templates. For example: <!–#include file='include.inc' –>.
   2. Use template expression:

      PHP: <?php include("@@('include.inc')@@"); ?>
      CFM: <cfinclude template="@@('include.inc')@@">

      JSP: <%@include file="@@('include.inc')@@" %>
      ASP & .NET: <!–#include file="@@('include.inc')@@" –>

      (NOTE: include.inc is the real file path, not the template parameter, so it has to be quoted.)

2. Using template parameters:
   1. Create a template parameter in the head section of the template: <!–TemplateParam name="inc_url_param" type="text" value='file="include.inc"' –>

      (NOTE: the parameter is given the "text" type)

   2. Change the include in the template to: <!–#include @@(inc_url_param)@@ –>

For other dependent files — CSS, IMAGE, and LINK (<A> anchor)

1. Without using template parameters, change the css link or image tag to:
   <link href="@@('styles.css')@@" rel="stylesheet" type="text/css" />

   @import url("@@('styles.css')@@");
   <img src="@@('image.gif')@@" />

   <a href="@@('link.htm')@@">link text</a>
   (NOTE: styles.css, image.gif and link.htm are the real file paths, not the template paramters, so they should be quoted.)

2. Using template parameters:
   1. Create template parameters in the head section of the template:
      <!–TemplateParam name="img_url_param" type="text" value="image.gif" –>

      <!–TemplateParam name="css_url_param" type="text" value="styles.css" –>
      (NOTE: the parameter is given the "text" type)

   2. Change the css link and img tag in the template to:
      <link href="@@(css_url_param)@@" rel="stylesheet" type="text/css" />
      @import url("@@(css_url_param)@@");

      <img src="@@(img_url_param)@@" />