Wtyczka do niestandardowego wykorzystania Google Analytics w WordPressie

Do tej pory korzystałem z wtyczki Google Analytics for WordPress, niestety z czasem okazało się, że nie posiada ona możliwości, które są mi potrzebne do testowania zaawansowanych i niestandardowych możliwości Google Analytics. Nadal uważam, że to bardzo dobra wtyczka i 95% osób będzie zadowolona z efektów jej działania. W tym wpisie przedstawię sposób na napisanie własnej wtyczki WordPress do obsługi Google Analytics z dorzucaniem niestandardowego kodu śledzącego.

Budowa własnej wtyczki w WordPress

Mechanizm tworzenia i uruchamiania wtyczek w WordPress nie jest skomplikowany. Stworzenie prostego wtyczk zajmuje kilka minut. Stworzenie wtyczki zaawansowanej wymaga więcej czasu, ale też jest możliwe a efekty mogą być naprawdę imponujące.

Uwagi do wtyczki: Podany niżej kod przedstawia całą wtyczkę. Ze względu na ograniczenia formatowania niektóre fragmenty kodu zostały podzielone na więcej niż jeden wiersz. Może to spowodować problemy w przypadku kiedy kod będzie bezpośrednio przeklejany z wpisu.

Na początek wtyczki należy dodać komentarz, w którym zostaną podane informacje opisujące wtyczkę. Główne informacje to nazwa wtyczki, autor i licencja. Kolejne to opis, ścieżka skąd można pobrać plugin, wymagana wersja WordPressa oraz aktualna wersja wtyczki.

/*
Plugin Name: GA Custom
Plugin URI: http://www.trajdos.pl/rozszerzenia/gacustom
Description: Zadaniem wtyczki jest doklejanie w sekcji Head
             strony własnego kodu śledzącego GA.
Version: 0.1 (alfa)
Requires at least: 3.1.1
Author: Łukasz Trajdos
Author URI: http://www.trajdos.pl
License: GPL2
*/

Opis wtyczki jest prosty i nie wymaga większego komentarza. Szczególnie, że w poprzednim wpisie już się na tym skupiałem.

Tworzona wtyczka ma dodawać kod Google Analytics. Plugin będzie testowany również na innym serwerze, dlatego w celu zabezpieczenia się przed gromadzeniem niepotrzebnych informacji będzie sprawdzana nazwa hosta na jakim wyświetla się strona. W przypadku tej wtyczki będzie to nazwa domeny blogu. Aby sprawdzanie było możliwe stworzyłem zmienną $host.

global $host;
$host = 'www.trajdos.pl';

Wszystkie funkcje add_action() wywoływane są dopiero po tym jak host serwera jest taki sam jak zadelarowany wcześniej w zmiennej $host. Po sprawdzeniu hosta wykonywane są cztery funcje add_action:

1. my_add_googleanalytics – dodaje kod Google Analytics do sekcji head (wp_head).
2. my_add_jquery – dodaje kod podpinającyc jQuery do strony w sekcji head (wp_head).
3. my_ga_track_linkout – dodaje do sekcji head instrukcje odpowiedzialne za śledzenie kliknięć w linki zewnętrzne (wp_head).
4. custom_add_action_my_ga_track_spenttime – funkcja odpowiedzialna za sprawdzenie czy jest to strona postu i jeżeli tak jest wstawienie kodu odpowiedzialnego za śledzenie długości odsłony (get_header).

Wszystkie funkcje zostaną opisane szczegółowo w dalszej części wpisu.

if($_SERVER['HTTP_HOST']==$host) {
   add_action('wp_head', 'my_add_googleanalytics');
   add_action('wp_head', 'my_add_jquery');
   add_action('wp_head', 'my_ga_track_linkout');
   add_action('get_header','custom_add_action_my_ga_track_spenttime');
}

W ramach funkcji custom_add_action_my_ga_track_spenttime() sprawdzana jest odpowiedź funkcji is_single(). Jeżeli zwrócona zostaje odpowiedź TRUE oznacza to, że aktualnie przeglądana jest strona wpisu. W takiej sytuacji wywoływana jest funkcja add_action, która wyzwala funkcję my_ga_track_spenttime().

Wywołanie funkcji my_ga_track_spenttime() musi być zrealizowane w taki sposób, ponieważ tylko w tym kontekście (względem get_header) funkcja jest w stanie prawidłowo sprawdzić czy aktualnie wyświetlana jest strona wpisu. W innych okolicznościach zawsze zwracane jest FALSE, przez co kod nigdy nie zostałby podpięty.

function custom_add_action_my_ga_track_spenttime() {
   if(is_single ()) {
      add_action('wp_head', 'my_ga_track_spenttime');
   }
}

Funkcja my_add_googleanalytics() wkleja kod Google Analytics.

Uwaga! Na temat Google Analytics i kodów pisałem we wpisie Zakładnie konta i tworzenie profilu w Google Analytics.

function my_add_googleanalytics() {
?>
   <script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-XXXXXXX-X']);
      _gaq.push(['_trackPageview']);
      (function() {
         var ga = document.createElement('script'); ga.type = 'text/javascript';
         ga.async = true;
         ga.src = ('https:' == document.location.protocol ? 'https://ssl'
         : 'http://www') + '.google-analytics.com/ga.js';
         var s = document.getElementsByTagName('script')[0];
         s.parentNode.insertBefore(ga, s);
      })();
   </script>
<?php
}

Funkcja my_add_jquery() wkleja kod odpowiedzialny za podłączenie do strony biblioteki jQuery w wersji 1.5.2 z serwera jquery.com.

function my_add_jquery() {
?>
   <script type='text/javascript'
   src='http://code.jquery.com/jquery-1.5.2.min.js'></script>
<?php
}

Funkcja my_ga_track_spenttime() odpowiedzialna jest za wklejenie kodu śledzącego zdarzenia polegające na mierzeniu czasu wyświetlania strony.

Uwaga! Kod wklejany przez funkcję był opisany we wpisie Jak obniżyć współczynnik odrzuceń (bounce rate) w Google Analytics.

function my_ga_track_spenttime() {
?>
   <script type="text/javascript">
      $(document).ready(function() {
         setTimeout(function() {
            _gaq.push(['_trackEvent', 'PageView', 'SpentTime', 'Short'])
         },30000)
         setTimeout(function() {
            _gaq.push(['_trackEvent', 'PageView', 'SpentTime', 'Medium'])
         },300000)
         setTimeout(function() {
            _gaq.push(['_trackEvent', 'PageView', 'SpentTime', 'Long'])
         },900000)
      });
   </script>
<?php
}

Funkcja my_ga_track_linkout() odpowiada za wklejenie kodu odpowiedzialnego za śledzenie kliknięć w linki wychodzące z serwisu.

Uwaga! Kod umieszczany przez funkcję był opisany we wpisie śledzenie linków wychodzących w Google Analytics.

function my_ga_track_linkout() {
?>
   <script type="text/javascript">
   $(document).ready(function() {
      $('a:not([href^="http://www.trajdos.pl"])').click(function() {
         var href = $(this).attr('href')
         .toString()
         .replace('http://','')
         .replace('https://','')
         _gaq.push(['_trackEvent', 'LinkOut', 'LeftClick', href])
      });
      $('a:not([href^="http://www.trajdos.pl"])').mousedown(function(event) {
         if(event.which == 3) {
            var href = $(this).attr('href')
            .toString()
            .replace('http://','')
            .replace('https://','')
            _gaq.push(['_trackEvent', 'LinkOut', 'RightClick', href])
         }
      });
   });
   </script>
<?php
}

I to wszystko. Wtyczka po odpowiednich modyfikacjach powinna działać na każdym blogu.

Podsumowanie

Aktualnie wtyczka jest bardzo prosta. Z czasem będzie się rozrastała i wzbogacała o nowe możliwości. Głównym celem dla mnie jest stworzenie narzędzia o dużych możliwościach, które można w pełni skonfigurować zaawansowane korzystanie Google Analytics z poziomu panelu administracyjnego WordPressa.