Embedding HTML files in other HTML pages

Question

I am new to HTML. I have an html page named "main.html" and i want to include another html page called "menu.html" in it. My main.html page doesn't include frames and it is designed using div tags. My site is hosted on linux based server The site I have to redesign is Java questions.

Answer 1

Check out server side includes.

Answer 2

You want to look at Server Side Includes (SSI). This tutorial by Apache should get you up and running if that site is running on Apache.

There are plenty of Server Side ways of doing this, but all except SSI require the use of a language other than HTML.

If you're using IIS, you can check out Microsoft's writeup on Server Side Includes.

Answer 3

You should use server-side includes. i.e. in jsp you can use: <c:import url="/include/navigation.jsp" />, in php <?php include("/sidebar.php");?> and so on. This is the good way to do what you need: include a navigation menu, or other parts common to all pages, without rewriting it in each page. You can also do the same in other ways (with some javascript i.e.) but I doubt that you want to build a site called Java Questions without any server side language.

Answer 4

You can make an ajax call in javascript if you want to avoid using the server.

In JQuery you would do:

<div id="putStuffHere">


</div>
<script>
$('#putStuffHere').load('myStuff.html');
</script>

Answer 5

Or use PHP for the future :)

Answer 6

I think that PHP is the easiest way to do this. Most of the time you can just change your main.html file to main.php then add this php code where you want the menu bar:

<?php include('menu.html'); ?>

And that's it! You have to make sure that php is installed on your sever. Also this will ONLY work on a server. So if you are testing on your computer and using something like dreamweaver (or even a browser), you won't see anything until it's online.