By Nannette Thacker - 05/01/1999
After you've been working with ASP development for a while, you will find that there are standard things which you include in every web page. To avoid using "Frankenstein cut-and-paste" code, you should setup a template which calls every standard page element. This template can then be used for every new page you create. If designed properly, you will never have to edit more than one page when a change has to be made to these standard elements. For instance...
Use Header and Footer functions instead of Cascading Style Sheets (CSS)
Cascading Style Sheets are great, but they are browser dependent. To avoid alienating the majority of browser users from your web site, you can setup every page as an .asp page (not an HTML page) and at the top of each page include a Header file and at the bottom of each page include a Footer file. When new elements need added or old elements removed from the header or footer (links to other pages or new images, perhaps), the change only needs to be made in one place.
All page elements, such as Header, Footer, TableHead, TableFoot, et cetera, can be stored in a subdirectory such as "/PageElements" or in your "/include" directory.
My ASP Template Used with This Site
Following is the source code for my ASP Template used with this site:
<%@ Language=VBScript %> <!--#include VIRTUAL ="/articles/include/pagetop.asp" --> <% '------------------------------------------------------ ' template.asp ' Page template for the site. ' ' Created 5/1/1999 by Nannette Thacker '------------------------------------------------------ Dim strPage, strPageDescription strPage = "template" strPageDescription = "ASP Advice: " %> <html> <head> <!--#include VIRTUAL ="/articles/include/meta.asp" --> <title> ASP Advice </title> </head> <!--#inclde VIRTUAL ="/articles/include/body.asp" --> <!--#include VIRTUAL ="/articles/include/header.asp" --> <br> <h3>ASP Advice:</h3><p> <!--#include VIRTUAL ="/articles/include/footer.asp" --> </body> </html>
Now I'll break the template down into its parts and describe what each include file does:
<!--#include VIRTUAL ="/articles/include/pagetop.asp" -->My pagetop.asp file is quite simple now. It simply consists of:
<% Option Explicit %>
Option Explicit forces me to Dim all of my variables. See my article on ASP Naming Conventions for details.
The pagetop.asp file can also include site password protection and other coding as needed. But the great thing is, if you put this include at the top of all of your .asp pages, later on when you wish to include something at the top of every page, you'll be ready to go!
<% '------------------------------------------------------ ' template.asp ' Page template for the site. ' ' Created 5/1/1999 by Nannette Thacker '------------------------------------------------------
Then, of course, you'll wish to document your code. You may wish to do this in VBScript so it is hidden and processed server side, or you may wish to include comments and copyright information client side with HTML comments instead. Or perhaps you'll wish to use both kinds of comments. Either way, be sure to comment your code.
Dim strPage, strPageDescription strPage = "template" strPageDescription = "ASP Advice: " %>
I like to create a strPage variable which contains the actual file name of the page. This may come in handy later on the page when you call something like a header, footer, or link. That way, you can customize your header, footer, links, validation functions, or whatever, dependent upon the name of the current page you are on. For instance, I have a javascript field validation function which is similar on multiple pages. I can use a VBScript if/else statement inside the Javascript to include certain field validation elements dependent upon the name of the current page.
The strPageDescription variable is used in the META tag. It allows you to customize the page description. For instance, in the include file shown below, the META tag prints the strPageDescription variable as part of the description. This allows you to use the same description on every single page, yet also customize the description as well.
<!--#include VIRTUAL ="/articles/include/meta.asp" -->
In the below block of code from the meta.asp file, the name of the .asp page is printed in an HTML comment at the top of each page. You can easily tell the file name by viewing the source code.
<% ' include the name of the page in the HTML code. When View Source from browser ' can easily find originating page if viewing from within a frame. Response.Write "<!-- " & strPage & ".asp -->" '------------------------------------------------------ ' /include/meta.asp ' Sets up the default meta tags for each page. ' The meta description can have additional text added ' to it as defined in the calling page via the variable ' "strPageDescription". ' ' Created 5/1/1999 by Nannette Thacker '------------------------------------------------------ %> <meta NAME="description" CONTENT=" <%Response.Write strPageDescription%> Web Application Development Advice. "> <meta NAME="keywords" CONTENT=" ASP, Active Server Pages, Web, programming, ASP Advice, Internet, Visual Interdev, VBScript, Javascript, HTML, web development, Oracle, MS SQL Server, database, ASP Warriors "> <meta name="resource-type" content="document"> <meta name="distribution" content="global"> <meta name="copyright" content="Shining Star Services"> <meta name="author" content="Nannette Thacker"> <meta name="generator" content> <meta name="robots" content="All">You can easily create page variables for the keywords list as well. Then add the keywords variable at the beginning of your keywords list to customize a META tag for each page.
<title> ASP Advice </title> </head> <!--#inclde VIRTUAL ="/articles/include/body.asp" --> <!--#include VIRTUAL ="/articles/include/header.asp" -->
Then is the Title, which you will alter for each page you create. I like to include my body tag in a body.asp page to be included in each page, rather than using cascading style sheets, since I don't want to exclude those who haven't updated their browsers. In my body.asp page I setup my default font and link colors.
<BODY background="/images/bg.gif" link="#FF8000" vlink="#DAA520" alink="#FF8000" TEXT="#000000"> <BASEFONT SIZE="3">
Now if I ever wish to change my basefont size, my background, or my link colors, I can change them in one place instead of having to edit every single page.
The rest of the template page includes a header.asp file, which prints my logo, and sets up my table, including the text in my left table.
<!--#include VIRTUAL ="/articles/include/header.asp" --> <br> <h3>ASP Advice:</h3><p> <!-- Body Text goes here....--> <!--#include VIRTUAL ="/articles/include/footer.asp" --> </body> </html>It also includes my code for the head text that falls at the top of each page, and my footer, which ends the table.
The rule is, anything that is repeated on multiple pages should be in your template. And anything which is a large amount of text or code, should be in an include file.
