How To Make Reuseable HTML Navigation Menus?

gio picture gio · Aug 4, 2009 · Viewed 19.2k times · Source

I'm sure this topic comes up all the time,
But I can't seem to fine a concise answer.

I've got a vertical menu bar that I want to reuse in webpages (>20). The Menu Bar is coded in HTML and uses uses: UL, LI, A, <Div> tags, and CSS. We need this:

  1. Reusable
  2. Maintainable
  3. Scalable

So we don't have to modify all pages every time we add a page.

We'd rather avoid a coding approach if possible. We could live with just one master file that we edit as needed. Since we're using CSS and <div>s, I don't think frames scale for us. What can we do?

Answer

zombat picture zombat · Aug 4, 2009

Server side includes are the way to go if you don't want to use a programming language.

They take this form:

<!--#include virtual="menu.html" -->

and will be inserted in the page wherever you put that tag in your HTML. It requires server side parsing, so your web server must have server side includes enabled. You can try it out, and if it doesn't work, contact your server host to see if you can get them enabled. If it's Apache, there's a method of enabling them via .htaccess files as well.