Easy Site Structure Using ssi, css and Dreamweaver Template

When your website design has been done using Dreamweaver template, and you want to make an update to a template, you will have to upload all the pages on the server

even after making a small change to a tamplate. However when you use 'ssi' files to built a website your maintenance work is greatly shortened and maintenance process simple and easy.

At first you need to set your website to Server Site based so all new pages you create will have the extension '.shtml'. To make this in Dreamweaver open preferences by bolding Ctrl+U on PC

Once you create a template, replace any parts of the website that show consistently throughout the pages and need frequent updates or future expansion, using ssi files. This will give better control over updating a website design.

How to creat a ssi file. and Cmd+U on Apple computer. Then create a template in Adobe Dreamweaver. (If you have old version of Dreamweaver it might be called Micromedia Dreamweaver. This technique was tested on Dreamwaver 8 but for the best result you need to use at Dreamveaver CS3 and up.)

1. Highlight and copy the element you want to replace on the Dreamweaver template, for instance menu/navigation.
2. Create new html document
3. Remove all coding from it so you end up having empty page when you see it in code preview
4. Paste the whole element you copied from Dreamweaver template you want to replace
5. Save the file with extension 'ssi'.

When you have created copies of the website elements as ssi files, replace them with appropriate files using code:



The whole html element will show up on the page preview. Most probably your code will look like this , as Dreamweaver will put template in a separate folder called 'Templates'. When pages are connected with the template the root file url will change to wherever the page is located. So no worries. You can also insert the ssi file by going to Insert>Server-Site Include.

This simple and powerful technique will save time for your future updates as you will need to upload and change on single ssi file. It is very useful in designing a website that requires future expansion of the navigation, header or footer. You can use this technique to even a higher level website structure based on Server-Site Include.