Using a dynamic <script> (a <script> appended to the DOM by JavaScript) to load and initialize Click
- by Bungle
I'm creating an HTML/JavaScript widget to be used on third-party sites. This widget is generated by a <script> that our customers will insert on their page. The <script> creates an <iframe> in the customer's domain, and then creates and inserts all of that <iframe>'s content using JavaScript.
It's important that this <iframe> contain Clicky's tracking code to monitor clicks on outbound links. Unfortunately, I'm not having any luck getting Clicky to work when I append the requisite <script> elements to the <iframe> using JavaScript.
I first tried simply appending the Clicky tracking code to the <iframe> after appending some test outbound links, hoping that Clicky could attach to those automatically as it does on a static page. That didn't seem to work, so my next inclination was to use the "advanced_disable" custom option and use clicky.log() on the links I want to track. Here's a link to a test page that's along those lines:
http://onespot.wsj.com/static/clicky_iframe_test.html
When clicking a link on that test page, the action is not logged in Clicky, and a JavaScript error appears:
clicky is not defined
This ("clicky") appears to be defined in http://static.getclicky.com/js, which I confirmed through the Firebug console is indeed loading before I click a test outbound link.
Has anyone successfully loaded Clicky in this way? If so, could you provide some sample code, a link to a working implementation, or some feedback on what's wrong with my code? I would also be interested to know if this is even possible.
Thanks very much for any help or advice!
