Tuesday, May 18, 2010

Fun with Eloqua and JQuery - Tracking PDF Links


(Guest post from Joel Rothman)

============================


I have been tinkering a little bit with jQuery. FULL DISCLOSURE, I don’t know the first thing about .js or .css. All I know is that often when I see something really cool on the web and I ask how it was done, I very often get the response ‘jQuery’. So, I did some digging. It’s basically a javascript library that is light weight, and designed to simplify client side scripting.

If you don’t know what it is, check out http://jquery.com/

When I was looking at all the functionality, I was thinking about ways that my clients could benefit. A relatively simple one was PDF tracking. The ability to track PDF’s is awesome. It allows for in depth lead scoring, as well as targeting and segmentation. PDF’s have always been a challenge, because you cannot embed JS directly into them, so you can’t load your Eloqua tracking scripts. The standard solution is to change the URL of the PDF’s to a file hosted on the clients site, with the URL as a query string. What this allows is for a web visitor to hit an HTML page, that does 2 things:

1. It records the URL and pushes it into Eloqua as a page view

2. It redirects the visitor to the PDF

Now, this system works really well, but you do need to change every URL, and I have actually encountered CMS systems which do not allow this! So, I decided to see what I could do with JQuery.

Now, I am used an older jQuery library (1.3.2), but the same code should work for all. Basically, what it does is when a link that ends in .PDF is clicked, it loads a JS function that fires the URL into the Eloqua site map, then allows people to go to the page. I have tested on all major browsers, and it works well. Some mobile browsers do not have JS enabled by default (think older blackberrys). But, the nice thing is, the PDF still loads fine.

In order to get the code to work, the first thing you need is to load the elqFCS.js file that is included in your elqNow folder, using standard scripts. This can be included along with the standard Eloqua scripts:



And the jQuery script looks like this:







Obviously the line numbers are just there for reference. But, it breaks out as follows:

1. Loads jQuery library

2. Starts script

3. The $ starts the jQuery function. This line is pretty standard, and just defines that something is going to happen on a defined event

4. Again, the $ means jQuery. This reads “when an attribute with a value of PDF at the end is clicked, run the following function

5. This function is the standard Eloqua FCS function, which basically forces a URL into the site map, when the URL is loaded in the brackets. The (this).attr(“href”) portion grabs the URL of the PDF that is clicked

The rest is just closing the scripts. Now, for line number 5, the key is to determine if your PDF links are relative or not. If they are not, then the above works. If they are, you might have to hardcode a domain in, or use a document.location function to grab the URL.

As well, in my samples I always had the function loading in the head tag, but I actually don’t think it matters.

The next step is to try to figure out how to capture right clicks on a PDF, for when people right click and save. I think this is really simple, using the following jquery plugin:

http://abeautifulsite.net/2008/05/jquery-right-click-plugin/

Any feedback? Anybody else doing anything interesting using Eloqua and jQuery?

11 comments:

Ross Olson said...

You've got a typo on the first line of your jQuery script. The 'type=' should be 'src=' right?

Joel Rothman said...

Hi Ross,
You are correct. I made a cut and paste error. I can't input scripts, so I just dropped the script tag below. The first line should be as follows:

script type="text/javascript" src="/jquery-1.3.2.js"> /script

J Armstrong said...

Nicely Done.

tsoulen said...

Anyone got this working with relative URL's and JQuery 1.4.2?

Rudi Shumpert said...

Nice post, it got me thinking and helped me solve a similar issue.

Is there any additional information on the other functions in the implementation scripts and what they can be used for?

-Rudi

Joel Rothman said...

Hi Rudi,
I saw your blog post. I am glad you found this article useful.
That script (elqFCS.js) is actually used to track flash content, the idea being when someone loads a flash file you can force a URL into Eloqua via action script. The best description of that use case is in section 2.4 of the following doc:
Reference Guide - Integrating Web site Pages and Forms Using Scripts

Anonymous said...

I would like to see a method of tracking pdfs using eloqua's web service. In my case I don't know if a resource is pdf, image, doc, etc. before a query to the database. We use a handler which handles all asset requests, so the href to images, pdfs etc. look like this:
"assets.ashs?assetid=123"
So, although using jquery's powerful selector is a great generic way of tracking pdfs, we are stuck with the redirect method which is buggy and SEO friendless.

Anonymous said...

"when a link that ends in .PDF is clicked, it loads a JS function that fires the URL into the Eloqua site map" - Can these URLs (from Eloqua site map) be setup for Lead Scoring?

Steven Woods said...

Anonymous, absolutely they can. They appear in Eloqua exactly like any regular URL, so are available for all the tagging and segmentation that is normally possible.

Chris said...

Can this same method be used to force URL's into E10?

Steven Woods said...

Chris,
yes, I believe that would work