Click here to Skip to main content
15,305,039 members
Articles / Web Development / HTML
Posted 29 Jan 2008


71 bookmarked

Adding a Build Banner to ASP.NET Pages

Rate me:
Please Sign up or sign in to vote.
4.74/5 (22 votes)
1 Feb 2008CPOL3 min read
This article explains a pluggable way to place a banner on pages built in debug mode, without making any code changes.
Sample Image - maximum width is 600 pixels


Developing Web applications is often a very dynamic process, and the 'instantly available' nature of the technology lends itself to iterative development processes, and frequent publication.
When deploying a build for UAT (User Acceptance Testing), it is helpful to display to customers something to remind them the current build is a debug build for a number of reasons:

  1. If a version number is shown in this banner, this can be easily referred to when submitting feedback.
  2. Build versions will often perform poorly compared to release versions of the same assemblies, the banner may explain this.
  3. The user may accidentally use the test site thinking it is the live one, or vice versa (this happens often!), the banner makes this obvious.

This document explains, and provides fully functional code, for a plugin to the HTTP pipeline which will render such a 'development banner' to any ASPX page in the website in question.
The only requirement is to add the appropriate configuration to the Web.config file, and ensure the banner assembly is in the sites bin directory.

The example banner is added to the page as a floating corner image, so as not to interrupt the layout of the page. The image, ALT text, and JavaScript are all stored as embedded resources in the final assembly, making this a completely standalone, and modular tool.

Background and Prerequisites

Basic knowledge of ASP.NET is required, and a rudimentary understanding of the HTTP pipeline would be helpful, but is not mandatory. In fact, if you wish to just start using the sample, you can download the completed assembly and skip straight to the "Configuration" section below!

Floating an Image

The banner image to be placed on the Web page is simply a partially transparent PNG, surrounded by an absolutely positioned DIV, which is aligned to the top-right hand corner of the page. JavaScript is used to place the required HTML on the page, rather than inserting the HTML directly into the hypertext stream.

<div style="Position: absolute;Top: 0;Right: 0;
    Background: transparent;Filter: Alpha(Opacity=60);-moz-opacity:.60;opacity:.60;">
    <img src="{0}" alt=\"development build: version {1}\" />

String formatting is used to insert the URL of the banner image, and the alternate text, into the HTML string.

// obtain the version number of the executing assembly, 
// so that it may be used in the banners alternate text 
Version version = page.GetType().BaseType.Assembly.GetName().Version;

// retrieve the banner HTML from the localized resources, 
// inserting a dynamic URL for the image, and the alternate text
string szHtml = string.Format(BuildConfigurationBannerResources.BannerHtml, 
    "Common.Web.Resources.BannerImage.png"), version);

// register a JavaScript that will insert the HTML into the DOM 
// after the page has loaded.
page.ClientScript.RegisterStartupScript(GetType(), "DevelopmentBanner", 
    string.Format("Event.observe(window, 'load', function()
        {{new Insertion.Bottom($(document.body), '{0}');}});", szHtml), true);

The HTTP Pipeline: Manipulating ASP On The Fly

The HTTP pipeline is an execution sequence in ASP.NET, ordering the sequence of execution when servicing an HTTP request.
Put basically, an HTTP module is an implementation of the IHttpModule interface, configured to be merged into this execution sequence via the Web.config, allowing developers to easily add functionality into this pipeline.

We are going to use an HTTP module to register our custom JavaScript on all ASP.NET pages that are serviced by the runtime.

The pipeline event we are interested in is PreRequestHandlerExecute, wherein we will attach our custom JavaScript. We could manipulate the HTML content directly, however there is no need to incur the complexity of parsing HTML, when we can simply use the C# Page object model - which will in turn take care of HTML output.

We can access the Page object through the Context Handler of the application, this will be a Page instance in the case of the request being for an ASPX page (as opposed to an AXD, or some other runtime mapped URL type).

IHttpHandler handler = application.Context.Handler;
if (handler is Page)
    Page page = handler as Page;
    if (IsAssemblyDebugBuild(page))

Deciding Whether to Show or Hide the Banner

To determine whether the Web application assembly is a Debug build, the following code looks for the DebuggableAttribute on the assembly - which is inserted by the .NET compiler during debug builds.

private bool IsAssemblyDebugBuild(Page page)
    foreach (Attribute att in 
        if (att is System.Diagnostics.DebuggableAttribute)
            return (att as System.Diagnostics.DebuggableAttribute).IsJITTrackingEnabled;
    return false;


To configure your Web application to use the banner, ensure the banner assembly is in your Web application's bin directory, and place the following XML in the Web.config file.

  <add name="Banner" type="Common.Web.Modules.BuildConfigurationBannerModule,

This is all that is required, and all Web pages in your application will have the banner applied to it, when built as a Debug assembly.


  • 2007.01.30: Initial publication


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Adam Langley
Software Developer (Senior)
New Zealand New Zealand
"Find a job you love, and you'll never work a day in your life."

Adam Langley is a software engineer in Auckland, New Zealand.

Software development is his personal passion, he takes pride in his work, and likes to share his experiences with the development community.

When he's not coercing computers, you'll find him riding his motorcycle, or attempting to carve something creative from bone.

Comments and Discussions

QuestionCustomizing for multiple environments like Development, QA, Staging etc? Pin
RK KL2-Jan-09 6:11
MemberRK KL2-Jan-09 6:11 
GeneralNice work, very useful Pin
Carl Reid8-Feb-08 3:46
MemberCarl Reid8-Feb-08 3:46 
GeneralRe: Nice work, very useful Pin
Adam Langley8-Feb-08 20:44
MemberAdam Langley8-Feb-08 20:44 
GeneralRe: Nice work, very useful Pin
Matt Sollars20-Feb-08 9:47
MemberMatt Sollars20-Feb-08 9:47 
GeneralVersion is always Pin
m1ke c6-Feb-08 3:02
Memberm1ke c6-Feb-08 3:02 
AnswerRe: Version is always Pin
Adam Langley6-Feb-08 10:10
MemberAdam Langley6-Feb-08 10:10 
AnswerRe: Version is always Pin
Kanedogg086-Feb-08 16:24
MemberKanedogg086-Feb-08 16:24 
GeneralRe: Version is always Pin
bibbynet19-Feb-08 19:47
Memberbibbynet19-Feb-08 19:47 
QuestionRe: Version is always Pin
Adam Langley19-Feb-08 20:23
MemberAdam Langley19-Feb-08 20:23 
GeneralRe: Version is always Pin
bibbynet20-Feb-08 6:38
Memberbibbynet20-Feb-08 6:38 
GeneralAwesome Idea! Pin
Vasudevan Deepak Kumar5-Feb-08 22:26
MemberVasudevan Deepak Kumar5-Feb-08 22:26 
GeneralGetCustomAttributes Pin
Ed.Poore3-Feb-08 12:15
MemberEd.Poore3-Feb-08 12:15 
GeneralThanks Pin
Ray Clanan31-Jan-08 9:15
MemberRay Clanan31-Jan-08 9:15 
GeneralLove It - Small Change I Made Pin
John Knaack30-Jan-08 8:59
MemberJohn Knaack30-Jan-08 8:59 
GeneralRe: Love It - Small Change I Made Pin
Adam Langley30-Jan-08 10:08
MemberAdam Langley30-Jan-08 10:08 
GeneralRe: Love It - Small Change I Made Pin
Ray Clanan31-Jan-08 10:33
MemberRay Clanan31-Jan-08 10:33 
GeneralRe: Love It - Small Change I Made Pin
Adam Langley31-Jan-08 10:54
MemberAdam Langley31-Jan-08 10:54 
GeneralRe: Love It - Small Change I Made Pin
Ray Clanan1-Feb-08 2:16
MemberRay Clanan1-Feb-08 2:16 
GeneralGreat Idea Pin
merlin98130-Jan-08 4:15
professionalmerlin98130-Jan-08 4:15 
GeneralFixed instead of absolute Pin
thany.nl29-Jan-08 23:37
Memberthany.nl29-Jan-08 23:37 
GeneralRe: Fixed instead of absolute Pin
Adam Langley30-Jan-08 10:05
MemberAdam Langley30-Jan-08 10:05 
Generalgood thing Pin
asen5129-Jan-08 22:41
Memberasen5129-Jan-08 22:41 
Generalcool Pin
PragneshMPatel29-Jan-08 21:44
MemberPragneshMPatel29-Jan-08 21:44 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.