3 Comments on “How to load external html code to web page?”

1. pete h
   April 19th, 2008 at 6:25 am

   Depends on your editor…

   A .dwt file is a Dynamic Web Template that some editors, such as Dreamweaver and Expression web work with. Of course, you have to create the template first, then spawn each individual page from it to make this work. Also, you have to include ‘editable regions’ in the template to make it workable. This is all pretty easy to get down in both Dreamweaver and Expression.

   I’m not sure about other editors or how they create template files.

2. Andy L
   April 21st, 2008 at 8:06 pm

   When using SHTML, or PHP, or Coldfusion, or many other languages – you can use what is called an “include”. Which does exactly what you want, include a single file on multiple pages so that you only have to edit code in one place.

   However, and im more than willing to be corrected on this, I don’t think there is any way to use includes in bog-standard HTML.

   Edit: or use templates like pete says – silly me!

3. two pi
   April 24th, 2008 at 4:30 am

   This is one of the most common reasons to use a server-side language like PHP, ASP.NET, or cold fusion. It’s pretty trivial to use the include statement in these languages to include code before it’s been presented to the user. Content management systems do this sort of thing all the time.

   Here’s a rough outline (done in PHP)

   If you don’t want to (or can’t) use a server-side language, there are two other alternatives. Check to see if your server allows SSI (server-side includes) This technology tells the server to preview a file and incorporate parts into the original:

   Note that you may have to alter the file extension (.shtml) to make your server perform the includes.

   Recently people have been using AJAX to perform the same process with Javascript. If you use a tool like jquery (a free download from ) you can include text or HTML with basic JavaScript:

   $(document).ready(function() {
   $(“title”).load(“title.txt”);
   $(“#menu”).load(“menu.html”);
   $(#main”).load(“main.html”);
   } );

Leave a Reply

You must be logged in to post a comment.