Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How to use a common link bar 1

Status
Not open for further replies.
perrymans

perrymans

IS-IT--Management
Nov 27, 2001
1,340
US
My father is part of a non-profit that is all volunteer based, and none of them do web pages (their webmaster passed a couple years ago).

Now, they are going to make some updates to the site. One of the things that needed to be updated was a link in the drop down menu bar at the top of the page. Problem is, that bar is on each of the 86 .html pages individually! So it had to be updated on each.

Now, I am an Access programmer with little understanding of HTML, but I imagine that you can create a single .html file with the header on it, then link to that file so the menu bar loads at the top of each page, but only has to be updated from menu.html.

The menu code is below, please let me know how to accomplish this.

Thanks. Sean.

Code: 
<!-- Layout script -->
  <script language="JavaScript" src="./menu.js"></script>
  <script language="JavaScript">
<!--
var NCCMenu = new MenuBar("NCCMenu",0,2,0,0,0,1,1,"solid","#CC0000","#87CEFA","#66CCFF","Verdana,Tahoma,Arial,Helvetica",10,"normal","bold","#000000","#3300CC","");
var m1_NCCMenu = new Menu("Home",106,125,"./index.html");
NCCMenu.addMenu(m1_NCCMenu);
var m2_NCCMenu = new Menu("Chapter",106,125);
m2_NCCMenu.addMenuItem("WhoWeAre","./whoweare.html");
m2_NCCMenu.addMenuItem("Members","./members.html");
m2_NCCMenu.addMenuItem("ComingEvents","./comingevents.html");
m2_NCCMenu.addMenuItem("Newsletter","./newsletter.pdf");
m2_NCCMenu.addMenuItem("JobsIndex","./jobsindex.html");
NCCMenu.addMenu(m2_NCCMenu);
var m3_NCCMenu = new Menu("AFOSI",106,125);
m3_NCCMenu.addMenuItem("Hall of Fame","./hall_of_fame.html");
m3_NCCMenu.addMenuItem("50th Anniversary","./50th_anniversary.html");
m3_NCCMenu.addMenuItem("EnlHeritageHall","./enlheritagehall.html");
m3_NCCMenu.addMenuItem("PressReleases","./pressreleases.html");
m3_NCCMenu.addMenuItem("AFOSI Today","./afosi_today.html");
m3_NCCMenu.addMenuItem("AFOSI Yesterday","./afosi_yesterday.html");
m3_NCCMenu.addMenuItem("OSI Structure","./osi_structure.html");
m3_NCCMenu.addMenuItem("VeteransHistProject","./veteranshistproject.html");
NCCMenu.addMenu(m3_NCCMenu);
var m4_NCCMenu = new Menu("AFOSISA",106,125);
m4_NCCMenu.addMenuItem("MembersOnly","./membersonly.html");
m4_NCCMenu.addMenuItem("AssnManagement","./assnmanagement.html");
m4_NCCMenu.addMenuItem("AssnBylaws","./assnbylaws.html");
m4_NCCMenu.addMenuItem("History","./history.html");
m4_NCCMenu.addMenuItem("AFOSI Plaque","./afosi_plaque.html");
m4_NCCMenu.addMenuItem("CommemorativeRings","./commemorativerings.html");
m4_NCCMenu.addMenuItem("MillenniumBadge","./millenniumbadge.html");
m4_NCCMenu.addMenuItem("ScholarshipAwards","./scholarshipawards.html");
m4_NCCMenu.addMenuItem("ArlingtonMemorial","./arlingtonmemorial.html");
m4_NCCMenu.addMenuItem("Necrology","./necrology.html");
m4_NCCMenu.addMenuItem("Obituaries","./obituaries.html");
NCCMenu.addMenu(m4_NCCMenu);
var m5_NCCMenu = new Menu("Images",106,125,"./images.html");
NCCMenu.addMenu(m5_NCCMenu);
var m6_NCCMenu = new Menu("Links",106,125,"./links.html");
NCCMenu.addMenu(m6_NCCMenu);
var m7_NCCMenu = new Menu("Downloads",106,125,"./downloads.html");
NCCMenu.addMenu(m7_NCCMenu);
//-->
  </script><!-- Master script -->

  <link rel="STYLESHEET" type="text/css" href="./style.css">
  <link rel="STYLESHEET" type="text/css" href="./site.css">
  <style>
  </style>
</head>


<body nof="(MB=(DefaultMasterBorder, 104, 95, 4, 0), L=(NecrologyLayout, 755, 345))" style="background-color: rgb(240, 248, 255); background-image: none;" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
<center>




<script language="JavaScript"><!--
NCCMenu.start();
//--></script>
 <!-- Start of the Body for this Page -->
 <!-- Master Body script -->
 
Sort by date Sort by votes
add this entire section:
Code: 
var NCCMenu = new MenuBar("NCCMenu",0,2,0,0,0,1,1,"solid","#CC0000","#87CEFA","#66CCFF","Verdana,Tahoma,Arial,Helvetica",10,"normal","bold","#000000","#3300CC","");
var m1_NCCMenu = new Menu("Home",106,125,"./index.html");
NCCMenu.addMenu(m1_NCCMenu);
var m2_NCCMenu = new Menu("Chapter",106,125);
m2_NCCMenu.addMenuItem("WhoWeAre","./whoweare.html");
m2_NCCMenu.addMenuItem("Members","./members.html");
m2_NCCMenu.addMenuItem("ComingEvents","./comingevents.html");
m2_NCCMenu.addMenuItem("Newsletter","./newsletter.pdf");
m2_NCCMenu.addMenuItem("JobsIndex","./jobsindex.html");
NCCMenu.addMenu(m2_NCCMenu);
var m3_NCCMenu = new Menu("AFOSI",106,125);
m3_NCCMenu.addMenuItem("Hall of Fame","./hall_of_fame.html");
m3_NCCMenu.addMenuItem("50th Anniversary","./50th_anniversary.html");
m3_NCCMenu.addMenuItem("EnlHeritageHall","./enlheritagehall.html");
m3_NCCMenu.addMenuItem("PressReleases","./pressreleases.html");
m3_NCCMenu.addMenuItem("AFOSI Today","./afosi_today.html");
m3_NCCMenu.addMenuItem("AFOSI Yesterday","./afosi_yesterday.html");
m3_NCCMenu.addMenuItem("OSI Structure","./osi_structure.html");
m3_NCCMenu.addMenuItem("VeteransHistProject","./veteranshistproject.html");
NCCMenu.addMenu(m3_NCCMenu);
var m4_NCCMenu = new Menu("AFOSISA",106,125);
m4_NCCMenu.addMenuItem("MembersOnly","./membersonly.html");
m4_NCCMenu.addMenuItem("AssnManagement","./assnmanagement.html");
m4_NCCMenu.addMenuItem("AssnBylaws","./assnbylaws.html");
m4_NCCMenu.addMenuItem("History","./history.html");
m4_NCCMenu.addMenuItem("AFOSI Plaque","./afosi_plaque.html");
m4_NCCMenu.addMenuItem("CommemorativeRings","./commemorativerings.html");
m4_NCCMenu.addMenuItem("MillenniumBadge","./millenniumbadge.html");
m4_NCCMenu.addMenuItem("ScholarshipAwards","./scholarshipawards.html");
m4_NCCMenu.addMenuItem("ArlingtonMemorial","./arlingtonmemorial.html");
m4_NCCMenu.addMenuItem("Necrology","./necrology.html");
m4_NCCMenu.addMenuItem("Obituaries","./obituaries.html");
NCCMenu.addMenu(m4_NCCMenu);
var m5_NCCMenu = new Menu("Images",106,125,"./images.html");
NCCMenu.addMenu(m5_NCCMenu);
var m6_NCCMenu = new Menu("Links",106,125,"./links.html");
NCCMenu.addMenu(m6_NCCMenu);
var m7_NCCMenu = new Menu("Downloads",106,125,"./downloads.html");
NCCMenu.addMenu(m7_NCCMenu);
to a new file and save it with a .js extension. Then you can import it into the page the same way you're importing menu.js:
Code: 
<script language="JavaScript" src="./[!]yourNewJSFile[/!].js"></script>

-kaht

How much you wanna make a bet I can throw a football over them mountains?
sheepico.jpg
 
Upvote 0 Downvote
I tried it, but I think I am putting the script reference in the wrong place:

Code: 
  <title>Necrology</title>
<!-- Layout script -->
  <script language="JavaScript" src="./menu.js"></script>
  <script language="JavaScript">
<!--
  </script><!-- Master script -->

  <link rel="STYLESHEET" type="text/css" href="./style.css">
  <link rel="STYLESHEET" type="text/css" href="./site.css">
  <style>
  </style>
</head>


<body nof="(MB=(DefaultMasterBorder, 104, 95, 4, 0), L=(NecrologyLayout, 755, 345))" style="background-color: rgb(240, 248, 255); background-image: none;" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
<center>


<script language="JavaScript" src="./menubar.js"></script>
 <!-- Start of the Body for this Page -->
 <!-- Master Body script -->
 <a name="pageTop"></a>
 
<table nof="LY" border="0"......etc...etc

Thanks. Sean.
 
Upvote 0 Downvote
Bear in mind that if the only way of getting from one page to another is via your Javascript menu, search engines (which don't run javascript) are not going to list many of your pages.

Unless you're using free hosting, you may want to look into Server Side Includes (SSI) - which are usually a better way of including common content like this.

Frankly, you/they should probably be considering re-designing the site, maybe using some blog software or a simple CMS to permit input from multiple authors.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd
 
Upvote 0 Downvote
These are a bunch of old retirees, not too interested in Google hits.

I may learn more about the web and help them through the redesign, but right now I just want to simplify that menu bar.

Also, they use Macromedia Contribute to make changes to the website, which should tell you how simple their needs are.

Thanks. Sean.
 
Upvote 0 Downvote
Code: 
  <title>Necrology</title>
<!-- Layout script -->
  <script language="JavaScript" src="./menu.js"></script>
[!]Put the included script file here, make sure in your script file that you didn't include the <script> tags[/!]
  <script language="JavaScript">
<!-- [!]opening a comment that you're not closing, get rid of this line[/!]
  </script><!-- Master script -->

  <link rel="STYLESHEET" type="text/css" href="./style.css">
  <link rel="STYLESHEET" type="text/css" href="./site.css">
  <style>
  </style>
</head>


<body nof="(MB=(DefaultMasterBorder, 104, 95, 4, 0), L=(NecrologyLayout, 755, 345))" style="background-color: rgb(240, 248, 255); background-image: none;" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
<center>

[!]the script that was here before (NCCMenu.start();) can probably be moved into the included script above[/!]
[s]<script language="JavaScript" src="./menubar.js"></script>[/s] - [!]Put this in the <head> above[/!]
 <!-- Start of the Body for this Page -->
 <!-- Master Body script -->
 <a name="pageTop"></a>
 
<table nof="LY" border="0"......etc...etc

-kaht

How much you wanna make a bet I can throw a football over them mountains?
sheepico.jpg
 
Upvote 0 Downvote
Hey! Look at that! It works! Below is the final:

Code: 
  <title>Necrology</title>
<!-- Layout script -->
  <script language="JavaScript" src="./menu.js"></script>
  <script language="JavaScript" src="./menubar.js"></script>
  <script language="JavaScript">

  </script><!-- Master script -->

  <link rel="STYLESHEET" type="text/css" href="./style.css">
  <link rel="STYLESHEET" type="text/css" href="./site.css">
  <style>
  </style>
</head>

<body nof="(MB=(DefaultMasterBorder, 104, 95, 4, 0), L=(NecrologyLayout, 755, 345))" style="background-color: rgb(240, 248, 255); background-image: none;" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
<center>

<script language="JavaScript"><!--
NCCMenu.start();
//--></script>
 <!-- Start of the Body for this Page -->
 <!-- Master Body script -->
 <a name="pageTop...etc...etc

If you see anything else in there that shouldn't be, please let me know. Otherwise, thank you very much!

Sean.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

bdwilcox
  • Locked
  • Question
More efficient / manageable way to code this HTA w/ VBScript?
Replies
0
Views
736
bdwilcox
bdwilcox
scorney
  • Locked
  • Question
background image with overlay which Hover when over a specific Area/Form
Replies
1
Views
740
3esolar
3
Mike Lewis
  • Locked
  • Question
How to refresh a Javascript file in the browser's cache?
Replies
4
Views
1K
Mike Lewis
Mike Lewis
Alt255
  • Locked
  • Question
Searching for a string that contains brackets
Replies
0
Views
215
Alt255
Alt255
soni21
  • Locked
  • Question
JavaScript String to Number Conversion in HTML: Seeking Clarification
Replies
4
Views
1K
Chris Miller
Chris Miller

Part and Inventory Search

Sponsor

Back
Top