Create the ultimate Google Analytics Dashboard for Drupal – Part 2

Create the ultimate Google Analytics Dashboard for Drupal – Part 2

By George Papadongonas 27th September 2012 Drupal

In the first part of this series, we discussed how to install and configure the Google Analytics Reports module for Drupal and display some basic metrics. In this second part, we are going to examine how to create your own custom dashboards, using the Google Analytics Core Reporting API. The latest update of the API on September 18th, added a lot of new Metrics and Dimensions related to social and mobile and now gives us the ability to create more useful marketing reports.

So, for our example, we are going to create a Social Media Dashboard, to track social activities and see if and how they drive engaged users and qualified traffic. Here’s how the final Dashboard will look like:

To create these reports, you have to to use the 7.x-3.x-dev version of the GA Reports module, as it offers integration with Views 3. You also need to apply this patch that adds all the new "datapoints" as Views Fields.

After the module installation, you will be able to create a new view, with the option to use Google Analytics data:

In order to build the Dashboard, first you have to create different Views Content Panes and then, using Page manager to build a custom Dashboard page with Panels. To create the Views, you can use all the available GA dimensions and metrics as fields, filters and sort criteria.
The first pane, named Social Visits, displays the most important Social Networks that drive traffic to the site, sorted by the number of visits.. In order to build it, you have to use the following settings:

There are three fields: The dimension ga:socialNetwork will represent the different Social Networks as rows in the table and the metrics ga:visits and ga:visitBounceRate will represent the two columns that display visits and bounce rate.

The second pane, Social Mobile Visits, displays identical data, but only for visitors that used a mobile device. The view is similar, but this time you have to use an extra filter for the mobile users.

The next pane, Social Mobile Visits by Device, displays the specific mobile devices that the visitors from Social Networks used. Google Analytics provides again the right metrics to track this kind of data:

In our fourth report, Landing Pages for Social, tracks the major Landing Pages for Social Networks Visits, helping to understand and optimize the visitor’s flow.

The fifth report, Social Actions, tracks the social actions that visitors perform in the site. If you’re using social buttons, you have to follow the directions from Google Analytics documentation, in order to track Facebook likes or tweets in the website.

In the final report, Goal Completion by Source, we display the total number of conversions for the main social sources.

The final step is to create a Page from Page Manager (admin/structure/pages/add) and add the View Panes to the Panels Layout:

Using the same method and with a little help from the Google Analytics API Documentation and Query Explorer, you can create any dashboard for different departments or specific needs (ex. Newsletter Dashboard, SEO Dashboard etc) and you can give access only to specific users or roles.

In the next part of this series, we are going to examine how we can use the Google Charts API to produce charts and present the Google Analytics data in a more interesting and useful manner.

Comments

Troels Kjems's picture
Troels Kjems

Well written post. You can always argue to what extent it makes sense to recreate functionality that is already present in Google Analytics, but if your users have a need to display metrics outside of GA then your series of posts is very useful reading.

Ajay Gallewale's picture
Ajay Gallewale

Instead of complete site data, how can I show charts based on a per node basis? In other words showing visits to that single node only from various channels? That way the author of each node can see how his story is attracting social visits etc.

george papadongonas's picture
George Papadongonas

@Troels Kjems Usually, it's more convenient for the site admins or editors to have a dashboard in Drupal, easily accessible every time they are using the site. The second reason is that we can create more complex Dashboards, combining data from GA, Drupal statistics or other sources.

george papadongonas's picture
George Papadongonas

@Ajay Gallewale Google Analytics Reports creates by default a block named "Google Analytics Page Traffic". If you enable this, you can see the page traffic for every node. By clicking on the page traffic details, a new page opens with more detailed statistics for this specific node, like Unique Views, Time on Page, Bounce Rate, Top referrals and Top Keywords.

Anthony C's picture
Anthony C

Hi, very interesting post ! I would like to create a new view using GA Data just like you but I don't have the Google Analytics Views module, I can't find it ... Can you please tell me how you did to install this module. Currently, I have the GA, GA API and GA Reports modules installed (Drupal 7). Thanks for your help. Regards

george papadongonas's picture
George Papadongonas

Hi, Google Analytics Views module is included into Google Analytics Reports 7.x-3.x-dev.

Anthony C's picture
Anthony C

Alright but I dont see the the GA Views module installed in the modules page. Anyway, my problem is that I am not able to create a view with the option to use Google Analytics.. The option isn't in the "combobox". Do you think I miss a module or a parameter ? Thanks for taking time. Rgds

Add comment

Search form

Latest comments

  • Daniel's picture

    By the way, by "no documentation" I´m referring to Views Autorefresh. It is either not complete or conflicting.

    Daniel
  • Daniel's picture

    Thanks for this info, but can't get it working with Statuses view. There is just about no documentation or it's conflicting, even from module maintainer (on Drupal vs. Blog). I'm using the default Statuses block, which only autorefreshes the current user's status updates, does not autorefresh friends' status updates (that is how it normally works). So I added Views Autorefresh. I have tried using the maintainer's instructions, but don't get a Secondary Display on the original view unless I have a Page display within that same view. Have you tried with Statuses? Just to confirm your steps:
    1. First, I clone the original view and ADD a Contextual filter. In mine it is Statuses Comments: Created time (with operator).
    2. ADD to the cloned view the Global: Text Area, PHP. Nothing else in the Header. Have also tried it with a simple Global: Autorefresh.
    2. In the ORIGINAL view, I ADD the same Global: Text Area, PHP code. Nothing else in the Header or contextual filters?

    I've tried just about every variation and nothing works. Can you offer any advice?
    Thanks
    Daniel

    Daniel
  • katalog's picture

    Excellent way of explaining, and pleasant post
    to obtain data on the topic of my presentation topic, which i am going to deliver
    in college.

    katalog