Have a single menu on multiple pages?

Question

So I have a website and I'm using a basic menu located at the top right corner of the screen. It's links are as follows:

| Home | Blog | Results | Pictures | Our Location |

Form time to time I need to add a new link to the menu or change where one of the links points to. This means that on every page that the menu exist I must manually change the link. Surely there is some way to have a master menu that is just put on every page.

Or am I dreaming?

Solution available here: http://stackoverflow.com/questions/39447411/how-to-load-nav-menu-from-an-external-file-no-wamp-all-code-must-be-browser — Gabriel, Sep 12 '16 at 17:09

score 3 · Accepted Answer · answered Feb 07 '10 at 08:02

3

Put the menu in a separate file and include it on the server side, either using a full-blown scripting language like PHP (one line) or using SSI.

answered Feb 07 '10 at 08:02

Max Shawabkeh

37,799
10
82
91

I don't know php. Could you provide an example of how to use SSI? – Bob Dylan Feb 07 '10 at 08:03
1

There's a SSI example in the linked article (` – Max Shawabkeh Feb 07 '10 at 08:06
S.: So I just found out Yahoo Small Business doesn't support `.shtml`. Any other options? – Bob Dylan Feb 07 '10 at 08:20
I went with the PHP include. I guess it's never to late to learn. ;-) – Bob Dylan Feb 07 '10 at 08:26

score 3 · Answer 2 · answered Feb 07 '10 at 08:02

There are various ways to do this. It depends what you have access to on the server. Possibly the simplest mechanism is server-side includes. You would just have a file that contains the menu and include it on every page.

You can also do this with every programming language in more or less elegant ways.

EDIT: The SSI is quite simple. You can just make a /header.html file, then do:

 <!--#include virtual="/header.html" -->

in the appropriate place.

score 3 · Answer 3 · answered Feb 07 '10 at 08:13

3

use the PHP include on all your pages

<?php include 'includes/menu.php'; ?>

and have a separate menu.php within a folder named 'includes'. you'll need to save all oyur pages as .php

you can make your footer as an include too

answered Feb 07 '10 at 08:13

pixeltocode

5,312
11
52
69

Ahmed Mansour · Answer 4 · 2017-10-17T15:40:35.770

2

I think this is the easiest way of doing it without a server side language. Use a javascript library like W3Data. All you need to do is add the w3-include-html attribute to your div. Done!

If your menu is in a file called menu.html you'd do something like this.

<div w3-include-html="menu.html"></div>

edited Oct 17 '17 at 15:40

answered Nov 14 '16 at 19:03

Ahmed Mansour

527
5
13

I have experimented with various approaches and this works perfectly. The library is w3.js from W3 schools and it's use is well documented on the W3 schools site. – Jeremy Young Oct 17 '17 at 15:41

score 0 · Answer 5 · answered Feb 07 '10 at 08:05

Have a server side program determine what menus and locations of the links need to be there. Then use ajax to periodically poll the server side script to get the contents of the menu at the current time.

It'd be easy to have it send an xml data back like:

<menu>
    <link name="Home" href="destinationhome.html"/>
...
    <link name="Pictures" href="....html"/>
 </menu>

Then build your links from that data.

score 0 · Answer 6 · answered Feb 07 '10 at 13:22

0

You can generate pages from templates before uploading them: See Template Toolkit.

answered Feb 07 '10 at 13:22

Sinan Ünür

116,958
15
196
339

Have a single menu on multiple pages?

6 Answers6

Linked