|Your resource center for web design
tips, css tutorials and many more!
DESIGN - Whats Inside:
Basic Rules on Web Design
- Whats Inside: Should You Bother
Learning HTML to Build Webpages? [
- Whats Inside: CSS Web Site
Design Basics [
Learn HTML - HTML Server Side
What the Heck is Server Side HTML?
by: Robert Plank
If you're stuck in the dark ages and are still editing the pages
of your web site by hand, there's an easy way to change the
look of your web site on a moment's notice, by editing only
I know, there are all kinds of brand new blogging scripts, forums,
CMSes, and other stuff to make your site easy to update. But
on the other hand there are just as many desktop-based programs
that churn out thousands of static HTML files for you to put
on your server.
What do you do when you have to change these files later? Edit
them by hand, one at a time? I don't think so.
You can save a lot of time down the road using Server Side Includes
The point of using Server Side HTML is so you can include other
pages on your regular HTML pages, things like a list of links
you regularly update OR a header and footer.
Try it out. Take one of those static HTML pages on your site
and rename it to something like "filename.shtml" instead
of "filename.html." All we've done is changed the
"html" at the end to "shtml."
Now, take the part of that site you want to appear on every
page (the header graphic, link sidebar, etc.), copy and paste
that part and save it into a file named "header.shtml."
REMOVE that text from your filename.shtml file.
Now, in the filename.shtml file, place this at the top:
(IMPORTANT: Replace the brackets [ and ] above with the greater-than
and less-than "HTML" brackets... hold shift and press
the "comma" and "period" keys on your keyboard.)
Upload filename.shtml and header.shtml to your server and load
header.shtml. If everything went well, the page should look
exactly as it did before. The only difference is: you only need
that one "include virtual" line to show the top of
the page, AND to change that top HTML later on all you have
to do is edit header.shtml.
If you had this sort of code on 20,000 pages of your web site
all you'd have to do was edit that ONE header.shtml file, and
your entire site would change as soon as you uploaded that header.shtml
Not bad, huh?
Now do the same thing with the bottom of your web site, only
save the new file as footer.shtml and at the bottom of filename.shtml
Again, not that exact code... replace the hard-brackets with
But wait, your fancy page generator software will only save
the files as .HTM or .HTML, and specifically links to certain
files. You can't just go in and edit everything to link to .SHTML
Htaccess to the rescue.
Place this in a new text file:
AddHandler server-parsed .shtml .html .htm
Save that as "htaccess.txt", upload to your web server,
and rename that htaccess.txt file you just uploaded to ".htaccess",
WITH the dot in front. Now try renaming filename.shtml to filename.html.
Guess what, your server side includes now work on .html and
.htm files too.
Hopefully your page generator software allows you to edit the
template and place these server-side include tags in there.
(If not, look into a program called BKReplaceEm.) Don't worry,
the pages will look funny and broken on your hard drive but
once they are sitting on your web server everything will turn
If you find yourself doing a bunch of repetitive HTML editing
it might be time to look into Server Side Includes to make instant
About The Author
You know what else, you can use a similar bit of HTACCESS code
to make PHP scripts act as HTML files. That, plus 35 more "Why
Didn't I Think of Those" secrets are revealed in my upcoming