Member Avatar for swornavidhya_m

I've created a seperate html files for navigation, content and footer. I want to club those files. All the navigation, content, footer files resides in the same directory where the index.html file resides. I want to include the above mentioned html files inside the index.html. I have tried using the following in index.html file
<!-- #include virtual="topbanner.html" -->

I also tried using the asp code which also fails. I tried with asp by changing all the html file extensions as .asp. Then i tried to place the following asp code in index.asp file as
<!-- #include file="topbanner.asp" -->


Kindly solve my problem. This is an urgent thing to do for me.

M.Sworna Vidhya

  • 5 Contributors
  • 4 Replies
  • 197 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Dandello

Dani AI

Generated

Short summary and practical options for (and anyone else reading this later): you can combine separate navigation/content/footer files into one page by either assembling them on the server, injecting them client-side, or building the final HTML at deploy time. Which method to use depends on what your host supports.

If the host runs server-side code (recommended for SEO and simplicity), use a server-side include mechanism provided by your platform (classic ASP, PHP, etc.). For example, with PHP rename the main file to index.php and include the fragments from the same directory:

<!-- index.php -->
<!doctype html>
<html>
<head><meta charset="utf-8"><title>Site</title></head>
<body>
<?php include 'topbanner.html'; ?>
<?php include 'content.html'; ?>
<?php include 'footer.html'; ?>
</body>
</html>

If you cannot run server-side code (static hosting), inject fragments with client-side JavaScript. This works on any static host and is useful for quick setups, but remember it requires the browser (or crawler) to execute JS:

<!-- index.html -->
<div id="topbanner"></div>

<script>
fetch('topbanner.html')
  .then(r => r.text())
  .then(html => document.getElementById('topbanner').innerHTML = html)
  .catch(e => console.error('Include failed:', e));
</script>

Short troubleshooting checklist (addresses why renaming to .asp or using includes might have appeared to “fail”):

  • Always request pages over HTTP from a web server (not file://). Server-side includes are ignored when opening files locally.
  • Make sure your server actually supports the chosen technology (IIS must have classic ASP enabled; PHP must be installed).
  • Use correct paths: use root-relative (/includes/nav.html) or check relative paths inside fragments (CSS/script paths inside included snippets can break).
  • Keep include fragments as partials (only the markup you want inserted—no duplicate <html>/<head> wrappers).
  • If SEO matters, prefer server-side or build-time composition; client includes may delay visibility to crawlers.

This ties back to points raised by , and : frames are rarely ideal; server-side includes are best when available; client-side injection is a viable fallback for purely static hosting.

Recommended Answers

All 4 Replies

Member Avatar for ko ko

No. You can't include an HTML file into another. You can use frames for multiple HTML document embeds. You can find more details here .

Member Avatar for teedoff

Yes you can use SSI(server-side includes) if your hosting provider supports them. Read about them here.

Frames are not recommended as they are not always supported by every browser.
Coldfusion, ASP.net, and PHP all have include functions as well.

Edited by teedoff because: n/a
Member Avatar for Voyager97

Frames are not recommended as they are not always supported by every browser.

Biggest drawback with Frames : Search engine spiders don't like them.

Member Avatar for Dandello

ASP and PHP both allow includes. SSI is dependent on the server settings (some hosts allow them and some don't. If your host allows them, generally the file extension on the page with the includes will be .shtml.

You don't need a full html page to be included - you only need what would be inside the body as the include will inherit the properties of the including page.

As Voyager97 mentioned - Search engines don't do frames at all well.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.