Version 5.0
AdvertServe User Manual :: v5.0

Advanced Click Tracking

Flash

What is a clickTAG?

Adobe has created a pseudo standard called a clickTAG for tracking clicks with Flash banners. It is the only method of tracking clicks on Flash banners that is supported by the ad server.

In short, you need to insert a transparent button into the top-most layer of your Flash banner. Then you assign the button an action with some special ActionScript code that is designed to accept a click-tracking redirect URL as a parameter. Your button then uses that redirect URL as its link rather than having a direct link embedded inside the code.

Choosing a Flash Version

The ad server fully supports all versions of Flash up to and including Flash 10. If at all possible, however, we recommend that you choose Flash 9 or 10. According to surveys conducted by Adobe, 99.3% of users worldwide have the Flash 9 plugin while 98.7% of users have the Flash 10 plugin (See Reference -- June 2011).

The ActionScript Code

If you are an experienced Flash designer, you can probably skip over the tutorial and just grab the ActionScript code below. You do not need to make any modifications to the code! The ad server uses clickTAG for the parameter name and the code below is already prepared for this.

Flash 10 (ActionScript 3.0)

This is ActionScript 3.0 code. If you name your button something other than MyClickTagButton you must edit this code to change the button name. No other changes are necessary! Do not embed any links in the code. Just copy and paste verbatim.


MyClickTagButton.addEventListener(
  MouseEvent.CLICK,
  function():void {
    if (root.loaderInfo.parameters.clickTAG.substr(0,5) == "http:") {
      navigateToURL(
        new URLRequest(root.loaderInfo.parameters.clickTAG), "_blank"
      );
    }
  }
);

Flash 8 and 9 (ActionScript 2.0)

This is ActionScript 2.0 code. No changes are necessary! Do not embed any links in the code. Just copy and paste verbatim.


on (release) {
  if (_root.clickTAG.substr(0,5) == "http:") {
    getURL(_root.clickTAG, "_blank");
  }
}

Flash 4, 5, 6, and 7 (ActionScript 2.0)

Usage of these older versions of Flash is not recommended! If at all possible please use Flash 9 or 10.


on (release) {
  if (clickTAG.substr(0,5) == "http:") {
    getURL(clickTAG, "_top");
  }
}

The Tutorial

New to Flash? For more detailed step-by-step instructions, please click here to view our Flash clickTAG Tutorial.

Flash Documentation

You may also wish to refer to the Adobe Flash documentation for your version of Flash:

Creating the Media

After implementing the clickTAG in your Flash banner, you will need to create a new Flash banner media in the ad server. In the new Flash banner wizard, directly below the Movie URL field where you can upload your SWF file, you will see a field called ClickTAG URL. In that field, you should enter the URL where you want visitors to be redirected to after clicking on the banner.

You may also need to change the value of the ClickTAG Parameter field if you used a variable other than clickTAG in your banner. Flash treats parameter names with case sensitivity! If you entered the variable name as ClickTAG or clickTag then you must enter it exactly the same way in the ClickTAG Parameter field.

If you're creating another type of media, such as a HTML banner or dynamic media, you must include your destination URL in the parameters within the HTML code you have to display your Flash banner like this:


<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" WIDTH="250" HEIGHT="350" id="filename">
  <PARAM NAME="movie" VALUE="http://www.yoursite.com/flash/filename.swf?clickTAG=%%CLICKTAG%%http://www.gotohere.com/">
  <PARAM NAME="quality" VALUE="high">
  <PARAM NAME="bgcolor" VALUE="#FFFFFF">
  <EMBED src="http://www.yoursite.com/flash/filename.swf?clickTAG=%%CLICKTAG%%http://www.gotohere.com/" quality="high" bgcolor="#FFFFFF" WIDTH="250" HEIGHT="350" NAME="filename" ALIGN="" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
</OBJECT>

Forms

The ad server is able to automatically track clicks with HTML forms in most cases. The only cases where it cannot is if the form uses AJAX submission. If you are using AJAX you will have to embed tracking macros into your form manually as in the following example.


<FORM action="http://www.yoursite.com/cgi-bin/example.pl" method="POST">
  First Name: <INPUT type="text" name="firstname" size="35">
  Last Name: <INPUT type="text" name="lastname" size="35">
  <INPUT type="submit" value="Submit">
</FORM>

Assuming that the above is the HTML code for your form, you'd need to change it to look like the example below.


<FORM action="%%CLICKFORM%%" method="POST">
  First Name: <INPUT type="text" name="firstname" size="35">
  Last Name: <INPUT type="text" name="lastname" size="35">
  
  <INPUT type="hidden" name="cid" value="%%CID%%">
  <INPUT type="hidden" name="mid" value="%%MID%%">
  <INPUT type="hidden" name="pid" value="%%PID%%">
  <INPUT type="hidden" name="zid" value="%%ZID%%">
  <INPUT type="hidden" name="default" value="%%DEFAULT%%">
  <INPUT type="hidden" name="random" value="%%RANDOM%%">
  <INPUT type="hidden" name="timestamp" value="%%TIMESTAMP%%">
  <INPUT type="hidden" name="referrer" value="%%REFERRER%%">
  <INPUT type="hidden" name="redirect" value="http://www.yoursite.com/cgi-bin/example.pl">
  <INPUT type="hidden" name="variables" value="firstname,lastname">
  
  <INPUT type="submit" value="Submit">
</FORM>

Make sure that none of the parameter names in your form conflict with those used by the ad server!

Warning Warning

The ad server can accept form submissions using both GET and POST requests. However, once it tracks the click it will send a HTTP redirect to your form script with a query string containing the variables you specified. This results in the browser making a GET request to your form script, so your script must be able to accept a GET request. It is also worth noting that this limits the amount of data you can submit to 64k. In practice this is generally not a problem as most typical forms used in advertising submit less than 1k of data.

Tip Tip

If you do not want clicks on your form to be tracked, simply add a NOTRACK attribute to the end of the <FORM> tag (i.e. <FORM action="..." method="POST" NOTRACK>). This will instruct the ad server not to process the form. The ad server will not output the NOTRACK attribute when serving the ad in order to preserve HTML compliance.

HTML5

What is a clickTag?

Similarly to Flash, the ad server also supports using a clickTag with HTML5. In fact, you actually do not even need to implement a clickTag in most cases. The ad server will automatically insert a clickable layer with a clickTag on top of your banner if it doesn't detect one. However, that will break interactive HTML5 banners that require user input. Manually implementing a clickTag for such banners is required.

The Tutorial

For detailed step-by-step instructions, please click here to view our HTML5 clickTag Tutorial.

Creating the Media

After implementing the clickTag in your HTML5 banner, you will need to create a new HTML5 banner media in the ad server. The wizard will ask you to upload a ZIP file containing all of the HTML5 assets (HTML, CSS, JavaScript, images, fonts, etc...). At a minimum it must include one and only one .html file. The only other thing you need to provide is a Redirect URL, which is simply a link to the advertisers landing page.

JavaScript

The ad server is not able to automatically track clicks on links embedded within JavaScript. If you wish to track clicks, you will have to embed tracking macros into your links manually as in the following example.


<SCRIPT type="text/javascript">
document.write('<P>');
document.write('<A href="http://www.gotohere.com/" target="_blank">Your Link Here</A>');
document.write('</P>');
</SCRIPT>

Assuming that the above is the HTML code for your JavaScript link, you'd need to change it to look like the example below.


<SCRIPT type="text/javascript">
document.write('<P>');
document.write('<A href="%%CLICKLINK%%http://www.gotohere.com/" target="_blank">Your Link Here</A>');
document.write('</P>');
</SCRIPT>

Links

The ad server is able to automatically track clicks on links in most cases. The only cases where it cannot track clicks is if the link is embedded within <SCRIPT>, <IFRAME>, or <ILAYER> tags. If any of those tags are contained within the HTML, you will have to embed tracking macros into such links manually as in the following example.


<A href="http://www.gotohere.com/" target="_blank">Your Link Here</A>

Assuming that the above is the HTML code for your link, you'd need to change it to look like the example below.


<A href="%%CLICKLINK%%http://www.gotohere.com/" target="_blank">Your Link Here</A>

Tip Tip

If you do not want clicks on your link to be tracked, simply add a NOTRACK attribute to the end of the <A> tag (i.e. <A href="..." NOTRACK>example</A>). This will instruct the ad server not to process the link. The ad server will not output the NOTRACK attribute when serving the ad in order to preserve HTML compliance.

Maps

The ad server is able to automatically track clicks on image maps in most cases. The only cases where it cannot track clicks is if the map is embedded within <SCRIPT>, <IFRAME>, or <ILAYER> tags. If any of those tags are contained within the HTML, you will have to embed tracking macros into such links manually as in the following example.


<img src="http://www.w3schools.com/tags/planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map id="planetmap" name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="http://www.w3schools.com/tags/sun.htm" target="_blank" alt="Sun">
  <area shape="circle" coords="90,58,3" href="http://www.w3schools.com/tags/mercur.htm" target="_blank" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="http://www.w3schools.com/tags/venus.htm" target="_blank" alt="Venus">
</map>

Assuming that the above is the HTML code for your image map, you'd need to change it to look like the example below.


<img src="http://www.w3schools.com/tags/planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map id="planetmap" name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="%%CLICKLINK%%http://www.w3schools.com/tags/sun.htm" target="_blank" alt="Sun">
  <area shape="circle" coords="90,58,3" href="%%CLICKLINK%%http://www.w3schools.com/tags/mercur.htm" target="_blank" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="%%CLICKLINK%%http://www.w3schools.com/tags/venus.htm" target="_blank" alt="Venus">
</map>

Tip Tip

If you do not want clicks on your image map to be tracked, simply add a NOTRACK attribute to the end of the <AREA> tags (i.e. <AREA href="..." NOTRACK>). This will instruct the ad server not to process the linked area. The ad server will not output the NOTRACK attribute when serving the ad in order to preserve HTML compliance.