Calling navbar into html

Browser Compatible Version

This method will work in any browser that has JavaScript enabled, which is actually the majority.

We will be creating an external js file to include in your pages directly. So lets get started.

Step 1:

You will not need to create an external page for your navigation, as it will all be included in your js file, using the code format below:

document.write(” your navigation code will go here “);

Notice the highlighted area. This is where your navigation HTML code will go. The one thing to keep in mind when coding javascript in these methods, is the use of backslashes.

You need to preceed every quotation mark (”) within the highlighted area with a backslash (i.e. \” ). You will receive errors otherwise.

Once you have created the code above, save it as navinclude.js

Step 2:

Now you’ll just need to include the navigation into your pages with the following code:

<SCRIPT language=”Javascript” src=”navinclude.js”>
</SCRIPT>

Using any of these methods, will cause each page of your site to update when you update the one source file. So basically, in method 1, you would update navigation.html, and this would update your navigation on every page.

In this method, you would update the navinclude.js file.

You have a dynamically updatable site, without all of the headaches of updating each individual page. So, have fun! You can use the extra time to catch up on some reading, or learn how to grow oranges or something.

~ by culpritz on February 22, 2008.