Home arrow HTML arrow Page 6 - Make Your Own Cool Drop Down Ad's
HTML

Make Your Own Cool Drop Down Ad's


"The age of the banner ad is dead" shouts a self-proclaimed online marketer. "Banner ads represent a bad return on investment" writes another. The truth of the matter is that banner ad's aren't dead, my friend. In this article Tim shows us how to create a banner management application that lets us add nifty MySQL-blobbed, two part drop-down banners to our sites. If you run your own site then you can't afford not to read this tutorial!

Author Info:
By: Tim Pabst
Rating: 3 stars3 stars3 stars3 stars3 stars / 22
May 20, 2002
TABLE OF CONTENTS:
  1. · Make Your Own Cool Drop Down Ad's
  2. · How drop down ads work
  3. · The admin.php script
  4. · The admin.php script (contd.)
  5. · Viewing, expanding and collapsing a banner
  6. · Tracking the number of click-thrus
  7. · Conclusion

print this article
SEARCH DEVARTICLES

TOOLS YOU CAN USE

advertisement
Make Your Own Cool Drop Down Ad's - Tracking the number of click-thrus
(Page 6 of 7 )

Remember back to the admin.php script where the number of impressions, click thru’s and click-thru rate is listed for each banner. As we already know, the number of impressions is incremented whenever the viewBanner function is called. Track.php on the other hand increments the number of click-thru's for each banner and redirects the user to the destination link for that banner, depending on whether or not they clicked on the top or bottom banner.

Track.php starts by connecting to our MySQL database and incrementing the numClicks field for the selected banner:

@mysql_query("update banners set numClicks = numClicks + 1 where bannerId = " . $_GET["bannerId"]);

Remember that the banners ID is passed as the bannerId query string value, so that's why $_GET["bannerId"] is used in the SQL query. After the number of clicks has been incremented, it's a simple matter of determining if the user clicked on the top or bottom banner. This is accomplished by checking the img query string variable:

// Redirect the user to the link
if($_GET["img"] == "top")
{
// Get the link for the top banner
$result = @mysql_query("select link1 from banners where bannerId = " . $_GET["bannerId"]);
}
else
{
// Get the link for the bottom banner
$result = @mysql_query("select link2 from banners where bannerId = " . $_GET["bannerId"]);
}


Depending on which banner was clicked, we retrieve either the link1 or link2 field from the banners table. Once retrieved, we make sure that field was indeed returned and use the header function to redirect the user to that link:

if($row = mysql_fetch_row($result))
{
header("Location: " . $row[0]);
}


Sending the binary image data
As we saw earlier, the viewBanner function sets the src of each banner image to something like getbanner.php?bannerId=2&img=top. Getbanner.php connects to the database and retrieves the blob data for the banners image as well as its MIME type, depending on whether img is top or bottom:

if($_GET["img"] == "top")
{
// Get the top image for the banner
$result = mysql_query("select data1, type1 from banners where bannerId = " . $_GET["bannerId"]);
}
else
{
// Get the bottom image for the banner
$result = mysql_query("select data2, type2 from banners where bannerId = " . $_GET["bannerId"]);
}


Once the image and MIME type are retrieved, it's simply a matter of calling the header function to set the type of output and then echoing the binary data to the browser, like this:

if($row = mysql_fetch_row($result))
{
header("Content-type: " . $row[1]);
echo $row[0];
}


If you want to test getbanner.php then you can fire up your browser and visit http://localhost/getbanner.php?bannerId=1&img=top, assuming that you have added a banner with admin.php and that the scripts are installed on your local machine.
blog comments powered by Disqus
HTML ARTICLES

- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5
- BBC Adopts HTML 5, Mozilla Addresses Issues
- Advanced Sticky Footers in HTML and CSS
- HTML and CSS Sticky Footers
- Strategy Analytics Predicts HTML5 Phones to ...
- HTML5 Guidelines for Web Developers
- Learning HTML5 Game Programming
- More Engaging CSS3 and HTML Background Effec...
- Engaging HTML and CSS3 Background Effects
- More Web Columns with CSS3 and HTML
- Columns with CSS3 and HTML
- Creating Inline-Block HTML Elements with CSS
- Drag and Drop in HTML5: Parsing Local Files

Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 



© 2003-2012 by Developer Shed. All rights reserved. DS Cluster 8 - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials