How to create HTML Templates

Question

I have several HTML pages and some of the content is same for all the pages. Is there a way to put the content into a single file and include it in all the HTML Pages?

Lets say that the common data is in HTML format.

Answer 1

Yes you can use iframes for this purpose.

Design your master page in .html format and use it with iframe tag

 <iframe src="MasterPage.html"></iframe>

Refer following link:

http://reference.sitepoint.com/html/iframe

Answer 2

I think what you are looking for is a templating solution.

Answer 3

You can do it in jsp as follows

by using two ways

<jsp:include page="reuse.html" /> 

or

<@include file="reuse.html">

Have a look at this question What is the difference between <jsp:include page = ... > and <%@ include file = ... >?

Answer 4

You can do this in three places:

1. At build/publication time — you generate HTML documents from your data sources and then publish static files. This option works for everybody, but can make the build times rather long for very large sites. I use ttree for this.
2. At run time, on the server — this works in much the same way as the previous option, but is done on the server and on demand (i.e. when a page is requested). Template-toolkit is also an option here, but here are many many others, including Django templates and Smarty.
3. At run time, on the client — this involves pulling the content together using frames or JavaScript. It is unfriendly to search engines and will break bookmarking unless you are very careful. I don't recomment it.

Answer 5

One thing you can try is using PHP.

for example if all pages have a common header, create a new document with the name of header.php and place the contents of the header div inside. Every other page you want the header to appear just call it by using :

<?php include_once("header.php");?>

Hope this helps

Answer 6

The best way to do this is at run time.

This means using PHP, ASP, JSP or another server-side scripting solution to join your pages together on demand when sending them to the client.

In PHP, this can be achieved with the following:

<?php
    include_once("head.php");
?>
<!-- some body content -->
<?php
    include_once("foot.php");
?>

Managing your header, footer and content all separately makes it very easy to update your design without having to edit many files.

It is not recommended to do this client-side with frames/iframes, as this is very unfriendly to search engines and can slow down your server as several HTTP requests must be initiated.