iframeTracker is a jQuery plugin that allows you to track clicks on areas located in an iframe.
This can be useful for tracking:
- Clicks on native buttons (for example, «Facebook Like»)
- Clicks on social widgets (for example,» Like Box «in Facebook or» Widget for Communities » in VK)
- Clicks on embedded videos (such as Youtube)
- Clicks on ads (for example, Google Adsense)
- … clicks and any other frames.
How does it work?
Since it is not possible to get the content of the frame, tracking clicks on the content is based on an event blur.
How to use it in practice?
We wrap the iframe element we are interested in in a predefined class and call the function iframeTracker, and in it we set the code that should be executed when clicking on the iframe:
jQuery(document).ready(function($){
$('.iframe_wrap iframe').iframeTracker({
blurCallback: function(){
// Do something when iframe is clicked
}
});
});Integration into any analytics is quite simple:
In Google Tag Manger, create a Custom HTML Tag with the following content:
jQuery(document).ready(function ($) {
$('.iframe_wrap iframe').iframeTracker({
blurCallback: function () {
dataLayer.push({
'event': 'event_name',
'eventCategory': 'event_category',
'eventAction': 'click',
'eventLabel': 'event_label'
});
}
});
});
* For tracking to work, you must already have Track Type — Event tracking installed and configured for Universal Analytics.
In fact, we get a certain analog of the Click Listener functionality already built into GTM.
And then it’s simple — we can record clicks of visitors (using event called when clicking on the iframe as dialing rules in Google Tag Manager) in a successful conversion to Universal Analytics, Yandex Metrika, or any other analytical service that allows the goals to set the event (event).
Alternatively, you can add users to remarketing lists by calling their codes when they click on an iframe.
Plugin page on Github — https://github.com/finalclap/iframeTracker-jquery
