Silverlight Tips provides simple and useful tutorials and tips with real life examples, live demos and sample codes to download.
About authors:
Damon Serji
Damon Serji,
Silverlight developer working at Metia in London.
Gavin Wignall
Gavin Wignall,
Interactive Design Lead, working in design for over 10 years, the last 3 being in Silverlight.
Allan Muller
Allan Muller,
Developer, working on various types of Silverlight and WCF projects.
Recent comments

In my previous posts I explaind how to use Google Analytics in Silverlight to track different information about users interaction with your Silverlight application.

One of the things you want to include in your tracking report is how many users who visited your site had Silverlight installed and how many didn’t. In addition, you might want to go in deeper details and find out more about users who didn’t have your required  Silverlight plug-in on their computers:

- how many had an older version of Silverlight – and which version did they have
- how many had/didn’t have a Silverlight compatible platform
- haw many of users without Silverlight plug-in clicked on “Download Silverlight plug-in” that you provided
- how many didn’t download the Silverlight plug-in and continued interacting with the “none-Silverlight” version of the application that you provided (if you provided any)

The source code for this project is available for download from CodePlex.

You can capture all above details and add to your analytics report.

Doing above tracking requires you to A. Find the required information about user, and B. Send them to your analytics software.

You can find all information about the user Silverlight support from Silverlight.supportedUserAgent.js file which is provided by Microsoft. You can download Silverlight.supportedUserAgent.js from Microsoft’s website.

However in order to send the right data to Google Analytics/Webtrends (or any other analytics software) you need to modify this file slightly to send the information when necessary:

1. add Silverlight.supportedUserAgent.js to your project
After downloading the Silverlight.supportedUserAgent.js file, add it to your Web project and call if from your Default.aspx (or any page that hosts your Silverlight application). You can call this file from the header, but just make sure it is called after your Tracking.js file (your tracking code).

2. add tracking code to Silverlight.supportedUserAgent.js
If you open this file and have a look, you will quite quickly notice there are a few if-else statements which checks different browser and OS to see which is the user using. Off course it depends how you like your report to be generated and what you would like to capture, but this is what I have done:

At the end of “if (slua.OS != 'Unsupported')” statement and just before the final closing curly bracket, add the following tracking code:

trackEvent("SilverlightApplication", "Platform supports Silverlight", "OS: " + slua.OS + " - Browser: " + slua.Browser);

Above code could generates a similar report to this:

Category: SilverlightApplication
Action: Platform supports Silverlight
Label: OS: Windows – Browser: IE5

So by seeing above report I know how many users did support Silverlight and what platform where they using.

Find and modify the “if (version == '2.0')” and “else if (version == '1.0')”  statements at the bottom of the page and change them to include tracking code like this:

if (version == '2.0') {
    trackEvent("NoneSilverlight", "Unsupported silverlight", "Silverlight Version: 2.0");
    return (supUA && (slua.OS != 'MacPPC'));
}

else if (version == '1.0') {
    trackEvent("NoneSilverlight", "Unsupported silverlight", "Silverlight Version: 1.0");
    return (supUA && (ua.indexOf('Windows NT 5.0') < 0));
}

Now you know if user had a different version of Silverlight, and can drill down in the report to find out which version did they have.

3. If your Silverlight application was loaded
Since it is not clear from above report if user actually saw your Silverlight application you can add the below code:

In your Silverlight object add the following parameter:


<param name="onload" value="onSilverlightLoad" />

And then add the following java script code to your Default.aspx page:
function onSilverlightLoad(sender) {
    trackEvent("SilverlightApplication", "Platform supports Silverlight", "SilverlightApp was loaded");
}

This piece of code will be loaded every time your Silverlight application is loaded.

4. if user interacts with the none-Silverlight version of your site/application
if (and you must always) prepared a none- Silverlight version, using above method you should now have a good idea on how to send the tracking code to your analytics software if Silverlight was not loaded for any reason and the user carries on interacting with your none- Silverlight version.

Hint: to add none Silverlight version you can add your HTML inside the <object> tag and right after the last <param> tag. Any code or text before the </object> will be displayed when you don’t have Silverlight installed/enabled.

And to send the tracking on i.e. links, add it to your onload or similar function/event.

5. Call CheckSupported()function
Finally, add this function to your page:

function CheckSupported() {
    var tst = Silverlight.supportedUserAgent();
    if (tst) {
        return true;
    }
    else {
        return false;
    }
}

And now call it from your Default.aspx just before to </body> tag. i.e.:


<script type="text/javascript">
    CheckSupported();
</script>   
</body>

Posted by Damon Serji on 10. February 2010 13:24 under: Intermediate
 with 1 Comments

Comments

Social comments and analytics for this post

This post was mentioned on Twitter by silverlighttips: Tracking in Silverlight (Google Analytics) - Part II http://url4.eu/1Mfwf

Posted 2/13/2010 1:16:57 AM

Add comment


(Will show your Gravatar icon)

biuquote
  • Comment
  • Preview