This gist solves the common problem of firing a floodlight tag when you click a link. Most examples don't take into account that you can't simply fire the floodlight tag by creating a tag during the click
event. If you go with that approach, you will have a race condition where the floodlight tag may not fire successfully before the browser changes pages. To work around this issue, you have to do the following:
- Prevent the default click action of the link.
- Fire the floodlight tag, which is just a process of creating an iframe with a special URL.
- Once the floodlight tag successfully fires (
iframe.onload
), resume the normal click action.
I've done the work for you and put it into a snippet that you can insert on your page. This snippet requires no external dependencies, so it's 100% plug-and-play. The entire process takes fractions of a second, so the user shouldn't notice any lag while this is happening.
- Copy the JS above into your project.
- Change the button's ID in line #1
- Change the placeholder strings on line #5 to the floodlight tag's
source
,type
andcat
attributes found in the original floodlight tag snippet'ssrc
attribute.
Thanks for sharing.
I had to deal with a PDF redirect, which wouldn't work with
window.location
without some other changes, browser inconsistencies, etc. If you're OK with a new window, you can handle PDF click tracking with this slight change: