Programming an In-Text Advertising System under ASP.NET 3.5

(Page 1 of 4 )

Now, with the general requirements, architecture, and database definition in mind, in this installment, we are going to delve into the core code programming of the in-text ad system. But first of all, let’s familiarize ourselves with the invoking relationships between the files.

The invoking relationships between the files

According to the explanations in the first part of the series, the core of an in-text advertising system mainly focuses upon the post and rendering of the in-text ads. In this system, this is divided into six parts: the CSS files, JavaScript files, the server-side code files under folder App_Code, and three generic handlers, i.e. AdArray.ashx, AD.ashx, and redirect.ashx. For a better understanding of the invoking relationships of the six parts and related files, please refer to Figure 1 below.

Figure 1—the invoking relationships of the fix parts

Next, let’s research each of the six parts shown in Figure 1.

The cascade style sheet file

In the in-text ad system, we use the CSS file stylesheet.css to place all the style-related CSS code, where the code mainly relates to the ad window definition. The following gives the related CSS code definitions:

body {/*the general page style definition */

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

line-height: 150%;

}

a {/*hyperlink style definition */

color: #0000CC;

text-decoration: underline;

}

.STYLE1 {color: #FF3300}

#AdShowBoxContent p {/*the p element related style definition
inside the ad window */

white-space: nowrap;

margin: 0px;

padding-top: 3px;

padding-bottom: 2px;

overflow: hidden;

width:170px;

text-overflow:ellipsis;

}

#AdShowBox {/*ad window style definition*/

background-color: whiteSmoke;

font-size: 12px;

line-height: 150%;

font-family: Arial, Helvetica, sans-serif;

border: 1px solid Red;

display: none;

}

#AdShowBoxBartitle {/*the header title inside the ad window
style definition */

float: left;

font-weight: bold;

color: #0066FF;

}

#AdShowBoxBarClose {/* style definition for the ‘close’
button inside the ad window*/

float: right;

font-size: 14px;

font-weight: bold;

color: #FF0000;

}

#AdShowBoxBar {/* the header style definition inside the ad
window */

background-color:menu;

padding-top: 4px;

padding-right: 5px;

padding-left: 10px;

margin-right: auto;

margin-left: auto;

height: 22px;

}

#AdShowBoxContent {/* style definition for the contents
inside the ad window */

padding-top: 5px;

padding-right: 10px;

padding-bottom: 5px;

padding-left: 10px;

}

#AdShowBoxContent a {/* style definition for the a element
inside the ad window */

color: #0066FF;

text-decoration: underline;

}

In the above CSS code, the key contents relate to the ad window and related elements' style definitions. Of course, they are also easy to understand with the embedded explanations. Well, let’s go on to check out the main JavaScript files defined in the ad system.

Next: The JavaScript files >>
 

More ASP.NET Articles
More By Xianzhong Zhu

Comments On: Programming an In-Text Advertising System under ASP.NET 3.5

>>> Be the FIRST to comment on this article!