Tracking Clicks and Events

Tracking Clicks

To ensure that we track clickthroughs in JavaScript or Flash we need you to either make a call to the ADTECH.click('name', ['defaultURL']) function or  use  the clickthrough component (Legacy AS3).

When the ad is uploaded to ONE by AOL: Creative, you can edit both of these values in the clicks panel, so don’t worry too much about getting the name or URL right. You don’t have to enter the URL if you don’t know it  – this can be handled later on in the process by someone who does know.

To make your own click button, you need to make a call to the ADTECH.click('name', ['defaultURL']) function in your click handling code, where ‘name’ and ‘defaultUrl’ values will be used as your default values, which can be easily updated in ONE Creative as discussed above.  Please revisit JavaScript examples below on how to add clickthrough exit function calls to your code. 

JavaScript:

// assuming the element exists in your HTML structure 
// i.e. <div id="facebook-icon">...</div>
var facebookIcon = document.getElementById('facebook-icon');
facebookIcon.addEventListener('click', function() {
  ADTECH.click(‘Facebook Clickthrough’,’http://facebook.com/myFacebookPage’);
});

// assuming the element exists in your HTML structure 
// i.e. <button id="youtube-button">...</button>
var youtubeButton = document.getElementById('youtube-button');
youtubeButton.addEventListener('click', function() {
  ADTECH.click(‘YouTube Clickthrough’, ’http://youtube.com/myYoutubeChannel’);
});
Alternative: Inline HTML JavaScript function:
<a href="#" onclick="ADTECH.click('YouTube clickthrough', 'http://youtube.com/myYoutubeChannel');" title="Link: #">YouTube Exit Clickthrough</a>

For legacy FLASH

If you decide to use the component, drag the clickthrough button component over to the click area and then resize it to make sure it covers the part you want to be clickable. In the Component Parameters panel, you can give the clickthrough a Click Name (this is used in the reports to distinguish which clickthrough button was clicked on) and a Default URL.

For example, if you have two clickthrough buttons in your flash movie, one that links to your facebook page and one that links to your youtube page, you could have two buttons with the following code:

(Legacy) ActionScript code:
facebookButton.addEventListener(MouseEvent.CLICK, function() {
 ADTECH.click(‘Facebook Clickthrough’,’http://facebook.com/myFacebookPage’);
});

youtubeButton.addEventListener(MouseEvent.CLICK, function() {
 ADTECH.click('YouTube Clickthrough’,’http://youtube.com/myYoutubeChannel’);
});


Tracking EVENTS

RichMedia ads are, of course, about much more than the clickthroughs. They often contain other interactive elements for the user to click on or rollover. It is vital that these extra events are tracked and then reported on when the ad is live.

We, therefore, ask you to make a call to ADTECH.event(eventName) when such an event occurs. Like clickthroughs, this name can be overridden in ONE by AOL: Creative in the events panel so don’t worry too much about your grammar and capitalization – just make sure that an event is called!

As an example, let’s say you’re advertising a make of car with an interactive rich media ad. You could have two buttons in your creative execution, one that displays a car image to the user, and one that hides car image and displays car specifications to a user. You could have two buttons with the following code:

JavaScript:

// assuming the element exists in your HTML structure 
// i.e. <div id="car-image">...</div>
// i.e. <button id="specification-button">...</button>
var carImage = document.getElementById('car-image');
var specsButton = document.getElementById('specification-button');
carImage.addEventListener('click', function() {
  ADTECH.event('Viewed Car Image');
  specsButton.style.display = 'block';
});
specsButton.addEventListener('click', function() {
  ADTECH.event('Viewed Car Specifications');
  carImage.style.display = 'none';
});
Alternative: Inline HTML JavaScript function:
<a href="#" onclick="ADTECH.event('Viewed Car Specifications');" title="Car Specs: #">Car Specifications</a>
(legacy) Flash ActionScript:
// Event listener on button to display car image
carImageButton.addEventListener(MouseEvent.CLICK, function() {
 // Track "viewed car image" event 
 ADTECH.event('Viewed Car Image'); 
 // Go to frame 2 that contains image of car  
goToAndStop(2);
});

// Event listener on button to display car specifications
carImageButton.addEventListener(MouseEvent.CLICK, function() {
 // Track "viewed car specifications" event 
 ADTECH.event('Viewed Car Specifications'); 
 // Go to frame 3 that contains car specification details 
 goToAndStop(3);
});

Ad Viewability

With all our ads, it is often the case that you want to know if a user actually saw the ad. With this in mind, for all our rich media ads we attempt to determine whether the ad is visible in the viewport.

If the ad is able to break out of its iFrame, a viewable impression will be counted if either:

50% of the unit is visible in the viewport for 1 second.

37500px (Half an MPU) is visible in the viewport for 1 second.

The unit has a ‘sticky’ Y value.

These default values can always be changed on a per ad basis. If you would like to know more, please contact support@pictela.com.

Standard Framework Events

By default, we record several events as standard to give you more insight into how your rich media ad is performing. Below is a list of the events that we track along with a brief description.

Engagement

The user has hovered over the ad for more than 2 seconds OR they have triggered an event that is marked as a positive interaction.

Interactive Impression

The user has moused over the ad for 0.5 seconds AND they have triggered an event marked as a positive interaction.

Viewable Impression

50% or 37500px of the unit is visible in the viewport for at least 1 second.

Backup Impression

The backup content was rendered on the page.

Backup Viewable Impression

The backup content was viewed in the viewport.

Expand

The ad unit was expanded.

Contract

The ad unit was contracted.

Show

A floating content layer was shown.

Hide

A floating content layer was hidden.

Reload

A floating content layer was loaded from the start.

Close

A floating element was removed from the page.

Video Events

In addition to the above events, if you use our Video Component in your flash movie or you register your video player using ADTECH.registerVideoPlayer() in your HTML ad, we will track the below metrics by default.

Video Play

The user hit play on the video.

Video Start

Video stream began.

Video Pause

The video was paused.

Video Seek

The user changed the playhead position.

Video Replay

The video was replayed.

Video First Quartile

Video played back 25%.

Video Midpoint

Video played back 50%.

Video Third Quartile

Video played back 75%.

Video Complete

Video played back 100%.

Video Resume

Video was resumed after being paused.

Video Mute

Video was muted.

Video Unmute

Video was unmuted.

Video Fullscreen

Video entered fullscreen mode.

Feedback and Knowledge Base