How to implement click tracking in HTML5 / Rich media ads

Ad Butler uses a variety of macros to track clicks on HTML 5/Rich media ads. When AdButler serves an HTML5 ad, any macros present in index.html will be replaced with the corresponding value. In this case, [TRACKING_LINK] will be replaced with the tracking link.

To implement click tracking on ads from third party ad servers, read serving third party ad tags.


You can view our list of basic macros here.

HTML5 Supported Macros

[TRACKING_LINK] Unescaped click tracking macro.
[TRACKING_LINK_ENCODED] Escaped click tracking macro.
[RND] A random number generator.
[TIMESTAMP] The current timestamp.

Click Macro Implementation

JavaScript Method

The most common method of implementing click tracking in an HTML5 ad is inserting the click macro script into the index HTML file of your ad.

  1. In the head of the HTML file, add:
<script>window.clickTag = '[TRACKING_LINK]';</script>
  1. In the click handler function of your ad, ensure that window.clickTag is used as the redirect URL:
window.open(window.clickTag, '_blank');

This is a less common method to track clicks on HTML5 ads. This method can be used only if JavaScript is not being used for click redirection.

Here is a simple example:

<a href="[TRACKING_LINK]" target="_blank">Your Existing Ad Code Here</a>

You must place <a href="[TRACKING_LINK]" target="_blank"> just after the <body> tag, and

</a> just before the </body> tag.

If you're using a third party application to create the ad, you can also implement click tracking by adding a click event or clickable region in the ad. Then, instead of using the ad item's destination URL as the target for the click, insert one of our click tracking macros. When you export the ad, the macro must be in index.html.

Can't find what you're looking for?

Send us an email

hello@adbutler.com

Visit the blog

For more ad serving tips, industry news and AdButler insights.