overview: server-side includes
Includes allow you to to manage and update site-wide page content through a single file: the include file.
How Includes Work
The technology is wonderfully simple. You place a directive in your page where you want the contents of an external file (the include file) to be inserted. When your server encounters the directive, it reads the external include file and inserts its contents in place of the directive.
Includes are often more practical to use for medium-to-large sites because only the include file needs to be edited and uploaded to your server. Each page that contains a directive that references the include file is then updated instantly.
What does your server support?
Before you attempt to use SSI, contact your web-hosting company and ask them the following questions:
- Does my server support ASP, PHP, or ColdFusion?
- Does my server support plain SSI? Which file extensions do you allow for SSI?
To use plain SSI your host pages will need to us an .shtm or .shtml file extension instead of .htm or .html. Your include files can use any file extension that Dreamweaver supports - no matter which type of include you are employing. We recommend using the .htm file extension. That way, Dreamweaver will allow you to edit your include file in Design View.
To use PHP includes your host pages will need to use the .php file extension.
To use ASP includes your host pages will need to use the .asp file extension or the .aspx extension if you are using .NET.
To use ColdFusion includes your host pages will need to use the .cfm file extension.
What goes in an include file
For an include to work, the include file must contain only the code you wish to be inserted into your page. If your include will consist of a Pop Menu Magic menu, it should contain only the menu markup. You will need to delete the HTML tag, Meta tags, Head tags, and even the body tags. You will also need to remove any CSS link tags, style tags (outside the menu markup), and script tags. A Pop Menu Magic include file, in Dreamweaver Code View, should look like this:
Where do the html, head, and body tags go? Those tags and all of the pertinent attributes within them, go in your actual pages.
Setting Dreamweaver to show Includes in Design View
Dreamweaver can be set to display server-side includes in Design View.
-Choose Edit > Preferences
-Switch to the Invisible Elements category
-Place a Check in the box between Server-Side Includes: and Show contents of included file