ASP.NET AdRotator - Basic and Extending
By Doug Seven
Published: 10/21/2000
Reader Level: Beginner
Rated: This article has not yet been rated.
Be the first to rate it!
Tell a Friend
Rate this Article
Printable Version
Discuss in the Forums

In this day and age of eCommerce, advertising banners have proven to be a lucrative source of additional, or primary, income for many web sites. While Classic ASP offered an AdRotator component, it was complicated to use, and required way too much code. If you are like me, you may have found that it was often easier or better to create your own Ad Rotator function. ASP.NET offers a new AdRotator component. Like most things in ASP.NET, Microsoft has seen the drawbacks of the previous component and improved on it dramatically.

Lets take a look at how the Classic ASP AdRotator worked.

First, there was a puzzle of files that had to be assembled to get the whole enchilada. You needed the ASP page that was going to display the ad, a rotator schedule file, and a redirection file.

The Rotator Schedule was a text file that defined the ads to rotate. The first section (above the asterisk) defined the hyper-link and physical layout of the ad, while the following section defined the image location, URL, text and impression weight for the ads.

File: RandomAd.txt

REDIRECT AdRedir.asp
WIDTH 468
HEIGHT 60
BORDER 1
*
images/banner1.gif
http://www.codejunkies.net
Development for Masses
5
images/banner2.gif
http://www.ASPNextGen.com
Up Your ASP
5

Next you need the Redirection file (ad_redirect.asp in the sample above). This file was used to evaluate the URL passed in the QueryString and redirect the browser to the advertised site.

File: ASRedir.asp

<% Response.Redirect(Request.QueryString("url")) %>

Lastly we need the actual page that will display the ad. On the page we create an instance of MSWC.AdRotator, and call the GetAdvertisement() method.

<html>
<body>
<H1>AdRotator in Classic ASP</H1>
<%Set ad = Server.CreateObject("MSWC.AdRotator")%>
<%= ad.GetAdvertisement("RandomAd.txt") %>
</body>
</html>

Whew! That's a lot of work for a simple ad rotator. The fact that we need a page to redirect the hyper-link is a bit excessive to say the least. At the very least we should be able to get rid of that file. Not to mention, if we want to extend the functionality of the AdRotator we have some serious work to do. Wouldn't it be nice if the AdRotator was a simple, intrinsic control we could put on our page, and if the ads themselves were object-like, having elements we could add to easily extend the functionality of the AdRotator?

Welcome to the ASP.NET AdRotator!

The new ASP.NET AdRotator fulfills all you wishes (well...most of them anyway). The use of the AdRotator control could not be easier. Notice I called it a control. In ASP.NET the AdRotator is one of the Rich Controls that ships with ASP.NET. Like other controls, the AdRotator is put onto a page following similar syntax to HTML. It still requires a "rotator schedule", but it is now in the form of an XML file (like many things in ASP.NET). The benefit of this new design is the easy extendibility of the control. Simply adding new elements in the XML file enables you to extend the functionality of the AdRotator.

First lets look at the plan-brown-wrapper AdRotator, then we'll extend it a bit. The first step is to build the XML file the AdRotator will use to determine the ads to display. The Root Element of the XML file is called Advertisements. This Element has one or more Child Elements called Ad. Each Ad Element contains a number of Child Elements that define the Ad.

Note: XML is case sensitive...you've been warned!

Get It On

File:RandomAd.xml

<Advertisements>
  <Ad>
    <ImageUrl>images/banner1.gif</ImageUrl>
    <NavigateUrl>http://www.codejunkies.net</NavigateUrl>
    <AlternateText>Development for the Masses</AlternateText>
    <Keyword>Developers</Keyword>
    <Impressions>5</Impressions>
  </Ad>

  <Ad>
    <ImageUrl>images/banner2.gif</ImageUrl>
    <NavigateUrl>http://www.ASPNextGen.com</NavigateUrl>
    <AlternateText>Up Your ASP</AlternateText>
    <Keyword>ASP.NET</Keyword>
    <Impressions>5</Impressions>
  </Ad>
</Advertisements>

Break It Down

Each Ad is a child of the Root Element, Advertisements. Each Ad contains the following Child Elements that describe the Ad.

  • ImageUrl - The URL path to the image to display
  • NavigateUrl - The URL to link to
  • AlternateText - The text to use in the ALT attribute of the HTML IMG tag
  • Keyword - (optional) Used to specify a category for this Ad - used with the AdRotator KeyWordFilter property
  • Impressions - Indicates the relative weighting for the Ad

Lets go ahead an put this control to work.

File: AdRotatorPlus.aspx

<%@ Page Language="VB" %>
<html>
<body>
<H1>AdRotator in ASP.NET</H1>

<asp:AdRotator id=myAdRotator runat=server
    AdvertisementFile="RandomAd.xml"
    BorderWidth=2
    />

</body>
</html>

As you can see, we simply place the control on the page, and specify a couple properties. The AdvertisementFile property points to the XML file we created above. The control randomly chooses an Ad from the XML file and renders it in HTML output according to the Ad Elements.

Keyword Filtering

The ASP.NET AdRotator enables easy filtering of ads based on the optional Keyword element of the Ad. When the AdRotator is placed on a page, you can set the KeywordFilter property to show only Ads that match the keyword you specify.

<asp:AdRotator id=myAdRotator runat=server
    AdvertisementFile="RandomAd.xml"
    KeywordFilter="Developers"
    BorderWidth=2
    />

The above AdRotator will only display the CodeJunkies.Net Ad, as that is the only one with the Keyword element set to "Developer".

Extending the AdRotator

The ASP.NET AdRotator can easily be extended by adding new elements to the Ad and provided functionality to use the elements. As an example we will add a caption under the ad banner. To do this we first must add a Caption element to the Ad.

Get It On

File: RandomAd2.xml

<Advertisements>
  <Ad>
    <ImageUrl>images/banner1.gif</ImageUrl>
    <NavigateUrl>http://www.codejunkies.net</NavigateUrl>
    <AlternateText>Development for the Masses</AlternateText>
    <Keyword>Developers</Keyword>
    <Impressions>5</Impressions>
    <Caption>Advertisement: CodeJunkies.Net</Caption>
  </Ad>

  <Ad>
    <ImageUrl>images/banner2.gif</ImageUrl>
    <NavigateUrl>http://www.ASPNextGen.com</NavigateUrl>
    <AlternateText>Up Your ASP</AlternateText>
    <Keyword>ASP.NET</Keyword>
    <Impressions>5</Impressions>
    <Caption>Advertisement: ASPNextGen.com</Caption>
  </Ad>
</Advertisements>

Break It Down

Next, we add a call to a sub-procedure on the OnAdCreated event. In the AdCreated sub-procedure we evaluate the Caption of the Ad Element. If it is not empty then we set the Text and NavigateURL properties of an ASP.NET Hyperlink control to the Caption and NavigateUrl elements of the Ad.

Note: The Ad Element is passed to the sub-procedure as E (AdCreatedEventArgs)

<%@ Page Language="VB" %>
<html>
<head>
<script runat=server>
  Sub AdCreated(Source As Object, E As AdCreatedEventArgs)
    If E.AdProperties("Caption") <> "" Then
      lnkAdCaption.Text = E.AdProperties("Caption")
      lnkAdCaption.NavigateURL = E.AdProperties("NavigateUrl")
    End If
  End Sub
</script>
</head>
<body>
<H1>AdRotator in ASP.NET</H1>
<center>
<asp:AdRotator id=myAdRotator runat=server
    AdvertisementFile="RandomAd2.xml"
    BorderWidth=2
    OnAdCreated = "AdCreated"
    />
<br>
<asp:Hyperlink id=lnkAdCaption runat=server />
</center>
</body>
</html>

Just for fun, here is the HTML source rendered by the AdRotator and Hyperlink controls.

<html>
<head>
</head>
<body>
<H1>AdRotator in ASP.NET</H1>
<center>
<a id="myAdRotator" href="http://www.ASPNextGen.com"
    target="_top"><img src="images/banner2.gif" alt="Up Your ASP"
    style="border-width:2px;border-style:solid;"></a>
<Br>
<a id="lnkAdCaption"
    href="http://www.ASPNextGen.com">Advertisement: ASPNextGen.com</a>
</center>
</body>
</html>

Summary

As you can see, the new ASP.NET AdRotator is much simpler to use, and requires less overhead than the Classic ASP AdRotator. Additionally, the creation of Ads as XML Elements enables easy extendibility of the AdRotator.



Marketplace
(Sponsored Links)
What are the green links?
   



 
Copyright © 2007 CMP Tech LLC |
Privacy Policy (4/10/06) | Your California Privacy Rights (4/10/06) | Terms of Service | Advertising Info | About Us | Help