HomeASP.NET Building an ASP.NET Website Using Include ...
Building an ASP.NET Website Using Include Tags
Include tags allow you to build template-driven websites in ASP.NET very efficiently. If you're just learning how to build websites using this framework, keep reading; you're about to take your site building abilities to the next level.
Contributed by Codex-M Rating: / 6 February 23, 2010
The above tutorials illustrate very basic methods for starting a purely static website in ASP.NET. In this article, you will learn how to build websites efficiently with the use of include tags in ASP.NET. Include tags enable developer to go one step higher in the website development phase than doing all of the work in the static mode.
To get a grasp of what you are going to achieve, let's start with some explanation of the difference between purely static and template-driven websites.
Static and template-driven websites
Say for example that your ASP.NET websites consists of three important files, Default.aspx, About.aspx and Contact.aspx. Assume that the look and feel of each of these pages should be the same (this means the background, font colors, font types, sizes, etc all match and look consistent). For example, you have the following home page screen shot:
The web page layout has been divided into three major sections: sidebar navigation, header section and content. Of course the only thing that cannot be part of the template is the content, since every page has its own purpose and should have different content.
However, the header section and sidebar navigation should basically look the same on all of the pages regardless of the content. In a purely static website, you need to copy and paste the source code of the sidebar navigation and the header section to each of the other asp.net (.aspx) files. This might feel manageable if you have a website with only three aspx files. But what if you have more than a hundred files to manage? In this case, if the files are already in the FTP server; you need to download all of the website files to your local host, and then open them one by one for source code development/updating.
Now this looks like a very tedious task, and is very inefficient. In purely static websites, the sidebar navigation source code of the above screen shot is this:
The above two sets of source code can be found visually in every aspx file (for example: Default.aspx, About.aspx, and Contact.aspx) if it is a purely static ASP.NET website. Since the disadvantages of having a purely static website have been outlined above (it can be very inefficient to update if the website has more than 100 files), an alternative is clearly needed to make website development and updating easier.
This is where template-driven websites come into play. There is a big difference between the development of pure static and template-driven websites. In template-driven development, you no longer see the repetitive HTML source code of each of the above important sections (like sidebar navigation, header/body background). Instead, these snippets of HTML source code are "included" by an ASP script command and placed externally, outside of the website files.
This means that every time you need to update your website (for example, change website background, header section message, and even add new items in the sidebar navigation menu), you only need to edit one file -- the included ASP file -- in your ASP.NET server. The change will be automatically reflected on all of the website's pages. Thus, with template-driven development, you do not need to download all of the website's files, edit them in the local host and upload them back to the server.
This important "include" technique increases the efficiency of website development.
In ASP.NET, the included file has a file extension of ".inc." For example, "sidebar.inc" may represent the HTML source of the sidebar navigation, while "header.inc" may represent the header and background section.
The standard syntax of the ASP include tags is as follows:
<!--#include file="filename.inc"-->
You need to replace filename.inc with your specific include filename (e.g sidebar.inc). In purely static websites, you need to spot important website sections that are not part of the website content that need to be repeated on each of your website pages. For example, since it might be common in the near future to edit/update the sidebar, footer and header sections, the HTML source code can be converted to include tags for more efficiency and flexibility.
In the following example, a purely static website will be converted to a template-driven ASP.NET website using include tags. Below is the source code of the sidebar:
The following are the steps involved in exporting to .inc files:
Step 1: Open Windows notepad.
Step 2: Copy and paste the affected HTML source code (or any code you would like to be included in the .inc file, such as the sidebar source code shown in the previous section).
Step 3: Save the notepad file with the .inc extension (sidebar.inc in this example). See the screen shot below illustrating this process:
Step 4: Remove the included affected HTML source code from the aspx file; edit and replace it with this one line:
<!--#include file="sidebar.inc"-->
So instead of presenting the sidebar HTML code, it will now become:
Of course, if there is a mistake in the coding, the include tag won't work. You should take note of the following important tips:
1. It is extremely important to maintain relative URLs throughout the ASP.NET website development. When files gets transferred to a real web server (not the test environment), relative URLs make it possible for your files to work in the same way they did in the localhost environment without the need for further reworking (i.e. changing to absolute URLS). This adds efficiency.
2. In the example provided in this article, the include files (sidebar.inc as an example) were saved in the same path as the other vital ASP.NET web server files like Default.aspx (this assumes .inc are saved in the root directory). However, if .inc files are saved somewhere else, by perhaps putting them in the "folder" such that the path with respect to the server root will be:
/folder/sidebar.inc
The ASP include should also be:
<!--#include file="folder/sidebar.inc"-->
If the path to the .inc files is not correct, the entire website will not work (you will get a server error in ASP.NET).
3. If you start using .inc files, your CSS/web page styling can be affected. In this case, it is highly recommended that you make all of the style sheet instructions (for all web pages, not only for a specific web page) into an external CSS file which you will then reference from the template. For example:
ASP.NET 
Dynamic Sitemap and Navigation in ASP.Net
