Member Avatar for sammer021486

My menu is a very large menu and editing it on each individual page is very time consuming (~160 lines of code per chapter and there are 11 chapters).

So I am wondering if I can place my menu into another html document and then call/import it to the currently viewed page. If it can be done without jscript I would be happy, as I am new to web development, but if not then that is alright, will have to learn it some time.

  • 2 Contributors
  • 9 Replies
  • 118 Views
  • 3 Weeks Discussion Span
  • Latest Post Latest Post by sammer021486

Dani AI

Generated

This thread correctly identifies the pain: one menu, many pages, and a desire to avoid hand-editing. has already pointed toward server-side includes for hosted sites and is exploring local/offline options. Below are practical alternatives, pitfalls to watch for, and a small client-side example if learning a bit of JavaScript is acceptable.

Server-side or build-time assembly

  • The simplest, most robust solution for a hosted site is to keep the menu in one source and have pages generated with that menu included at run- or build-time. If the final product must be distributed on DVD/USB without a server, prefer a build step that produces fully assembled static pages. That removes the need for runtime servers or autorun hacks and avoids OS/security restrictions.

Client-side include (works in any static setup)

  • A lightweight approach is to load a small HTML fragment into a placeholder element when the page loads. This is good for learning JS and keeps the menu edit-as-one-file. Caveats: scripts inside inserted HTML won't run automatically, relative URLs in the fragment may need fixing, and duplicate IDs can clash. After insertion, add code to mark the active link so the current page shows as selected.

Example (client-side fetch + active-link highlight):

document.addEventListener('DOMContentLoaded', function() {
  fetch('menu.html')
    .then(r => r.text())
    .then(html => {
      document.getElementById('menu-placeholder').innerHTML = html;
      var path = location.pathname.split('/').pop();
      var a = document.querySelector('#menu-placeholder a[href$="' + path + '"]');
      if (a) a.classList.add('active');
    })
    .catch(console.error);
});

Practical tips and cautions

  • Use absolute or site-root-relative URLs in the menu when possible to avoid broken links from different folder depths.
  • Keep menu markup simple (ul/li/nav) and style from the parent page to avoid CSS isolation problems.
  • Ensure keyboard accessibility (focusable links, visible focus styles, aria-current for the active item).
  • Avoid relying on autorun or automatic executables for USB/DVD delivery; modern OS security often blocks that.

Given the choices: use server/build includes for hosted or distributable static sets; use client-side injection if you prefer minimal tooling and want to learn JS.

Recommended Answers

All 9 Replies

Member Avatar for almostbob

Yes, that is the foundation behind many websites
php asp shtml all have the ability to do server includes, all you need to do is find which of the above your server supports, and you can include the menu with a single statement, and it doesnt need to be a full html file, it just needs the menu, all the headers footers etc are predifined in the file doing the include, in php (files end with .php)it is <?php include('menufilename'); ?> at the point the menu is to sit
it is hugely easier than editing a multitude of separate menus

I have over 1600 pages on my site, but it really is 4 include files and a database, none of the viewable pages actually exist until you view them

Edited by almostbob because: n/a
Member Avatar for sammer021486

I know that the server supports php. I am coding in VS Web Development express 2008, I am using it to validate while I code, everything that I have coded so far is just html and css, nothing else.

As of right now I am not sure how the final product will be hosted. It maybe loaded onto the server, or it may also be burnt onto a DVD and accessed only when needed from the DVD. I am not sure if burning it to a DVD and running it from the DVD will prevent me from using the import for my menu or not.

Member Avatar for almostbob

most includes require server processing, different to what is available on a browser,
if you burn the thumbdrive version (noinstall portable or a bunch of other names) of the ide that the development is done in onto the dvd as well, no problems, the ide will support the incl;udes

Edited by almostbob because: n/a
Member Avatar for sammer021486

so if I took a program like XAMPP and loaded it onto the DVD, I could write an autorun script to cause the DVD to load the Home page of the website and the XAMPP would provide the server to run the import codes?

Member Avatar for almostbob

not sure about xamp's protocols and parameters, that would have to be looked up in the manual for xamp, or whatever runtime program is found that can display
but for many programs, the program can be called with a parameter of a filename that opens the file
This link to nusphere.com is a product I have used before

Member Avatar for sammer021486

I will have to play with xampp as I have no funds to purchase the program that you have recommended. Xampp says that it can run as a stand alone to develop web sites locally.

Member Avatar for almostbob

They wouldnt lie about that, (ability to run local) too easy to check, would solve all the problems that could possibly imagine, with a live cd/dvd you can upload the html files to a server from the dvd when needed or run locally

Member Avatar for sammer021486

I think that I have got it figured out. Unless someone can recommend another program or way of doing it. I am going to make a *.bat file to execute the XAMPP and start Apache, then use a *.inf to call the *.bat file and load the web page when the USB/CD/DVD is inserted.

Member Avatar for sammer021486

I think that I have it now. I created an *.exe file that launches the *.bat files required to start XAMPP, then after a pause, while XAMPP starts, have the web page open on the start page.

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.