Microsoft Silverlight Analytics Framework with Google Analytics

Yesterday I spent a somewhat frustrating day getting familiar with the Microsoft Silverlight Analytics Framework that was announced at MIX. It was frustrating not because the framework is hard to use, in fact far from it, but because there was a small bug in the GoogleAnalytics library that prevented it working in certain timezones (I tested it in Australia, New Zealand and parts of Europe and it appeared that there were issues in most timezones outside the US). This issue has now been resolved so if you are going to work with the GoogleAnalytics library with the SL Analytics Framework, make sure you get the latest source code, rather than downloading the initial release.

Firstly, some important URLs that you may want to take a look at:

– The Microsoft Silverlight Analytics Framework (http://msaf.codeplex.com/)

– The MSAF Google Analytics page (http://msaf.codeplex.com/wikipage?title=Google%20Analytics)

– Google’s information on working with the MSAF (http://code.google.com/apis/analytics/docs/tracking/silverlightTrackingIntro.html)

Ok, now let’s get started. To demonstrate how you can do this let’s use the default Silverlight Navigation project template from Visual Studio. We’ll add Google Analytics tracking so that you can track when users go between pages.

The first thing to do is to download the latest MSAF bits. Go to the codeplex site, click on the Source Code tab and then click the Download link under the Latest Version sign. This will download a zip file, which you should expand on your machine. Within the expanded folder locate the Silverlight 3 solution file (eg msaf-45617Silverlight.3Microsoft.WebAnalyticsMicrosoft.WebAnalytics.sln) and open it in Visual Studio 2008. You will see some prompts, one for the password to a signing key (just cancel this dialog) and some relating to source control (you can permanently remove the source control bindings). Once loaded, you want to rebuild the following projects:

– Microsoft.WebAnalytics

– Microsoft.WebAnalytics.Behaviors

– Microsoft.WebAnalytics.Navigation

For each of these projects grab the generated dll and copy it to a temporary folder. We’ll be needing these later on. Also from the Assemblies folder (eg msaf-45617Silverlight.3Microsoft.WebAnalyticsAssemblies) copy out the Google.WebAnalytics assembly).

We’ll create a new Silverlight application within Visual Studio using the Silverlight Navigation Application project template.

image

Add references to the dlls you copied to the temporary folder to your Silverlight application (not the associated web project). Also add a reference to System.Windows.Interactivity.

To wire up the MSAF you can either manually write the XAML, or you can open your Silverlight application in Expression Blend. I prefer the latter as it gives you great designer support for adding behaviors to your pages.

Open up the Assets window in Expression Blend and expand out the Behaviors node. Locate the ConsoleAnalytics behavior and drag it onto the LayoutRoot node in the Objects and timeline window.

image

Do the same for the TrackAction behavior, dragging it onto the ContentFrame node.

image

With the TrackAction behavior selected, go to the Properties window and locate the Trigger window. From the EventName dropdown select the Navigated event.

image

Press F5 and run the application. Make sure that the test page is displayed, rather than default.aspx (eg http://localhost:60288/MSAFWithGoogleSampleTestPage.aspx) When it loads in Internet Explorer press F12 to show the developer tools. Select the Script tab and watch the Console window on the right as you click on the Home and About buttons on you Silverlight application.

image

You can see from the console window that the tracking event is being raised each time you navigate between the frames of this application. The output is a result of using the ConsoleAnalytics that you added to the LayoutRoot. But it’s currently not sending anything to Google Analytics. To do this, you need to add the reference to Google Analytics library…

From the Assets window open the Locations node and go to the Google.WebAnalytics node. Drag the GoogleAnalytics behavior onto the LayoutRoot node in the Objects and timeline window.

Now, you’ll need to ensure you have a Google analytics account. If not go to www.google.com/analytics and sign up for an account. Once you have an account you can go into your account and locate the Web Property ID. Go to the overview page and you should see the Web Property ID as in the following image.

image

Copy this value and paste it into the Web Property ID in the Google Analytics section of the Properties window.

image

You probably also want to specify a Category so that you can data mine the events logged with Google Analytics. You’re read to run your application, so press F5 to run it.

Download and run fiddler and you can see that there are calls out to Google Analytics each time you click on the Home or About buttons.

image 

Hopefully this will help you get up and running with Google Analytics in conjunction with the Microsoft Silverlight Analytics Framework.

Leave a comment