Create a 2 column web page layout with navigation menu using ASP include file

Create a 2 column web page layout with navigation menu using ASP include file

:: "This is a much more efficient way to build web pages - referencing site-wide elements using .asp include files..."

***We'll use classic ASP for this simple and common navigation. You'll need a host that supports ASP (.asp file extensions) to get this going. Our extensions on our web pages will change to .asp instead of .html. Also .asp files are not viewable on your local computer unless you have IIS installed.***

We will now create and add an include file that contains all our left hand navigation links -2-col.html 2 col layout with left hand menu.

Notice that visually the page doesn't look any different from our initial menu example.

That's because our include file is functioning exactly the same as our hard coded menu links.

Our include file is transparent - just a more efficient "means to an end". The HTML link code is contained in the "include file" which is called by this line of code from every page in the website:

<--#include file="nav_menu.asp"-->

Let's create this page step step...remeber...you must be working on a server that supports .asp files.

Create Navigation Include File

Step 1. Copy and paste the code below into note pad

Step 2. Save the file to your web folder as "inc_nav.asp"

Add Include File Code

Copy and paste the code below into notepad - save as "2-col.asp". This is the same as 2-col.html but we need to change it to an .asp file to support include files / .asp Include files do not work with normal .html pages...

Now go the folder you saved the file in and open 2-col.asp (right click on the file and open with note pad), then, find this code:

<div id="subcontent">
</div>

Now add the include file code like so:
<div id="subcontent">
<!--#include file="nav_menu.asp"-->
</div>

Now save the page as 2-col.asp in your web folder. Upload both files to your server and reference the URL. The menu should be visible

Summary - Include File Menu

Now every time you create a new web page, just add a link to the Include file: , <!--#include file="nav_menu.asp"-->
every page will be updated thanks to us adding one simple line of code to our web page. Do this early on in your web building process!

Review the web building process: build web site free