Server side includes: how to avoid Dreamweaver library items

Library items in Dreamweaver are often used to create repeated elements (such as navigation menus or footers) on every page of a web site. However, updating Library items involves touching EVERY SINGLE PAGE that item resides on: a real developer no-no. One of the best solutions to this problem is server-side includes (SSI).

DEFINITION

A server-side include (SSI) is used to "paste" the contents of a file into a web page when it's served up on the web. By changing just the one file, it will be automatically updated on every page that includes it when next that page is served up.

TEMPLATE CODE

In your Dreamweaver Template, the HTML code will look something like this:

and the PHP code will resemble this:

<?php include("root/includes/globalNav.html") ?>

The globalNav.html file will be a partial HTML file, generally located inside of the <body></body> tags, and containing only the HTML for a specific section, it should not use the <html>, <body>, or <head> tags. This will generally suffice for most of what you want to do.

For further information on SSI commands, visit the W3C's helpful SSI tutorial.

PREVIEW IN DREAMWEAVER

With Dreamweaver you can preview documents containing SSI just as they’ll appear after they’re on the server. Select Edit > Preferences, select the Preview in Browser category, and make sure the Preview using temporary file option is selected.

SERVER NOTIFICATION

Before your SSIs will work, however, you need to tell the server to look for SSIs within your web pages. The easiest way to do this is to change the file extension of a web page from .html to .shtml.

However, for those concerned with keeping the .html file extension, there is another way: tell your server to treat .html files like .shtml files. To turn on SSI in most shared hosting environments, one must generally open up or create an .htaccess file. This is a text file that lives on your web server and gives it specific commands, like telling it to process the SSIs you have coded into your template.

Add the following code to your .htaccess file:

AddType text/html .html
AddHandler server-parsed .html
AddOutputFilter INCLUDES .html

Upload your .htaccess file to the root folder of site for which you want to use SSI and let the magic begin!