Interakcje społecznościowe – śledzenie sieci (ga.js)

Z tego dokumentu dowiesz się, jak za pomocą Google Analytics uzyskiwać dane o interakcjach w sieciach innych niż Google, np. Facebook czy Twitter. Skorzystaj z tego dokumentu, aby skonfigurować Analytics pod kątem przycisków udostępniania w mediach społecznościowych, jeśli jesteś właścicielem witryny, twórcą wtyczek do zarządzania treścią lub jesteś operatorem sieci społecznościowej i chcesz zapewnić automatyczne raportowanie interakcji społecznościowych użytkownikom przycisków udostępniania.

Wstęp

Domyślnie Google Analytics udostępnia zintegrowane raporty dotyczące przycisku +1. Oznacza to, że jeśli na tej samej stronie wdrożono kod ga.js i przycisk +1, wszystkie interakcje społecznościowe będą rejestrowane automatycznie. Więcej informacji o statystykach dotyczących +1-ek, w tym wskazówki dotyczące rozwiązywania problemów, znajdziesz w artykule Analityka sieci społecznościowych w Centrum pomocy.

Aby korzystać z analityki interakcji społecznościowych i raportów z innych sieci, takich jak Facebook czy Twitter, musisz zintegrować Google Analytics z każdym przyciskiem sieci. Dzięki Analizie wtyczek społecznościowych możesz zarejestrować różne interakcje od polubionych na Facebooku po „tweety” na Twitterze. Śledzenie zdarzeń może też śledzić ogólne interakcje z treściami, ale statystyki społecznościowe zapewniają spójną platformę rejestrowania takich interakcji. To z kolei zapewnia użytkownikom raportów Google Analytics spójny zestaw raportów do porównywania interakcji w sieciach społecznościowych w wielu sieciach.

Praktyczny przykład integracji Analytics z przyciskami Facebooka i Twittera znajdziesz w przykładowym kodzie statystyk społecznościowych.

Konfigurowanie analityki danych społecznościowych

Aby skonfigurować śledzenie interakcji społecznościowych, musisz użyć metody _trackSocial, która wysyła do Google Analytics dane o interakcjach społecznościowych. Metoda powinna być wywoływana po zakończeniu interakcji społecznościowej użytkownika. Każda sieć społecznościowa korzysta z innego mechanizmu w celu określenia, kiedy następuje interakcja społecznościowa, i zwykle wymaga to integracji z interfejsem API danego przycisku sieci.

Szczegóły dotyczące integracji Analytics z mediami społecznościowymi różnią się w zależności od sieci społecznościowej, dlatego w dalszej części tego przewodnika znajdziesz ogólne sprawdzone metody konfigurowania Analytics wtyczek społecznościowych w przypadku każdej z tych sieci. Zalecamy zapoznanie się z dokumentacją dla deweloperów dotyczącą poszczególnych sieci, aby dowiedzieć się więcej o jej implementacji.

Oto opis metody _trackSocial:

_gaq.push(['_trackSocial', network, socialAction, opt_target, opt_pagePath]);

w których parametry reprezentują:

  • network

    Wymagane. Ciąg znaków reprezentujący śledzoną sieć społecznościową (np. Facebook, Twitter, LinkedIn).

  • socialAction

    Wymagane. Ciąg znaków reprezentujący śledzoną interakcję społecznościową (np. polubienie, udostępnienie, tweet).

  • opt_target

    Opcjonalnie. Ciąg znaków reprezentujący adres URL (lub zasób), który otrzymuje działanie. Jeśli np. użytkownik kliknie przycisk Podoba mi się na stronie w witrynie, właściwość opt_target może mieć tytuł lub identyfikator używany do identyfikowania strony w systemie zarządzania treścią. W wielu przypadkach strona polubiona to ta sama strona, na której jesteś. Jeśli więc ten parametr to undefined lub zostanie pominięty, kod śledzenia domyślnie używa parametru document.location.href.

  • opt_pagePath

    Opcjonalnie. Ciąg znaków reprezentujący stronę według ścieżki (wraz z parametrami), na której wystąpiło działanie. Jeśli np. klikniesz przycisk Podoba mi się na stronie https://developers.google.com/analytics/devguides/, wartość opt_pagePath powinna być ustawiona na /analytics/devguides. Prawie zawsze źródłem interakcji społecznościowej jest ścieżka strony. Jeśli więc ten parametr ma wartość undefined lub zostanie pominięty, kod śledzenia domyślnie używa parametru location.pathname plus location.search. Musisz go skonfigurować tylko wtedy, gdy śledzisz wirtualne odsłony, modyfikując opcjonalny parametr ścieżki do strony za pomocą metody Google Analytics _trackPageview.

Działania na Facebooku

Według pakietu Facebook JavaScript SDK najprostszym sposobem na skonfigurowanie przycisku Podoba mi się na stronie jest użycie tego kodu:

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like></fb:like>

liczbę polubień.

Aby rejestrować polubienia w Google Analytics, zasubskrybuj zdarzenie edge.create Facebooka i utwórz funkcję wywołania zwrotnego w celu wykonania kodu śledzenia Google Analytics.

FB.Event.subscribe('edge.create', function(targetUrl) {
  _gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]);
});

Gdy użytkownik polubi Twoją stronę, zostanie wykonana funkcja wywołania zwrotnego i otrzyma adres URL polubionego zasobu. Zasób jest następnie przekazywany jako wartość do metody _trackSocial, aby usługa Google Analytics mogła raportować dane na temat sieci, działania i polubionego adresu URL.

Nie podoba mi się

Interfejsy API Facebooka pozwalają też na subskrybowanie innych interesujących zdarzeń, takich jak głosowanie na tak.

FB.Event.subscribe('edge.remove', function(targetUrl) {
  _gaq.push(['_trackSocial', 'facebook', 'unlike', targetUrl]);
});

Udostępnienia filmów

Możesz też subskrybować udostępnienia.

FB.Event.subscribe('message.send', function(targetUrl) {
  _gaq.push(['_trackSocial', 'facebook', 'send', targetUrl]);
});

tweety na Twitterze

Zgodnie z dokumentacją przycisku tweeta i zdarzeniami JavaScript Web Intents, aby zaimplementować przycisk Twittera na stronie i wykrywać interakcje użytkowników, należy użyć tego kodu:

<a href="http://developers.google.com/analytics" class="twitter-share-button" data-lang="en">Tweet</a>
<script type="text/javascript" charset="utf-8">
  window.twttr = (function (d,s,id) {
    var t, js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;
    js.src="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
    return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
  }(document, "script", "twitter-wjs"));
</script>

Aby śledzić zdarzenia przycisku tweeta w Google Analytics, musisz użyć na Twitterze zdarzeń JavaScript Web Intents i powiązać funkcję wywołania zwrotnego z Intent Event. Powiązania zdarzeń należy opakować w funkcji wywołania zwrotnego, aby mieć pewność, że wszystko się załadowało przed zdarzeniami powiązanymi.

function trackTwitter(intent_event) {
  if (intent_event) {
    var opt_pagePath;
    if (intent_event.target && intent_event.target.nodeName == 'IFRAME') {
          opt_target = extractParamFromUri(intent_event.target.src, 'url');
    }
    _gaq.push(['_trackSocial', 'twitter', 'tweet', opt_pagePath]);
  }
}

//Wrap event bindings - Wait for async js to load
twttr.ready(function (twttr) {
  //event bindings
  twttr.events.bind('tweet', trackTwitter);
});

Gdy użytkownik tweetuje, funkcja wywołania zwrotnego odbiera obiekt, za pomocą którego można zwykle uzyskać adres URL tweetowanego zasobu. Po wczytaniu kodu JavaScript Twittera link do tweeta z adnotacjami jest przekształcany w element iframe, a tweetowany adres URL jest kodowany i dołączany jako parametr zapytania do adresu URL elementu iframe. Obiekt zdarzenia przekazany do wywołania zwrotnego ma odniesienie do tego elementu iframe i możemy użyć go do uzyskania adresu URL tweetowanego zasobu.

Powyższa funkcja wywołania zwrotnego upewnia się, że odniesienie iframe rzeczywiście jest elementem iframe, a następnie próbuje wyodrębnić zasób odczytywany na Twitterze, sprawdzając parametr zapytania url.

Oto przykładowa funkcja wyodrębniania parametru zapytania z identyfikatora URI:

function extractParamFromUri(uri, paramName) {
  if (!uri) {
    return;
  }
  var regex = new RegExp('[\\?&#]' + paramName + '=([^&#]*)');
  var params = regex.exec(uri);
  if (params != null) {
    return unescape(params[1]);
  }
  return;
}

Parametr jest zwracany, jeśli znajduje się w ciągu zapytania. Jeśli nie ma parametru, funkcja zwraca wartość undefined, która jest przekazywana do metody _trackSocial, co skutkuje domyślnym działaniem metody.

Sprawdzone metody integracji

Wiele witryn dodaje przyciski społecznościowe za pomocą wtyczek do zarządzania treścią. Jeśli jesteś autorem takich wtyczek, zdecydowanie zalecamy zintegrowanie Analytics wtyczek społecznościowych, aby automatycznie rejestrować te interakcje. Jeśli jesteś programistą w sieci społecznościowej, możesz też znacznie ułatwić użytkownikom śledzenie Twoich interakcji w sieciach społecznościowych w Google Analytics dzięki integracji z analityką sieci społecznościowych.

Aby Ci pomóc, w tej sekcji znajdziesz sprawdzone metody integracji analityki wtyczek społecznościowych, by usługa lub system CMS automatycznie śledziły interakcje społecznościowe. Jeśli chcesz zobaczyć praktyczny przykład zastosowania tych wszystkich sprawdzonych metod, zapoznaj się z przykładowym kodem rozszerzenia społecznościowego Analytics.

Tworzenie instancji i korzystanie z kolejki _gaq

Najnowsza wersja kodu śledzenia Google Analytics obsługuje ładowanie synchroniczne i asynchroniczne. Aby umożliwić programistom wywoływanie metod, które nie zostały jeszcze wczytane, Google Analytics udostępnia kolejkę poleceń _gaq, do której można przekazać metody śledzenia _gaq.push();.

Po wczytaniu kodu śledzenia wszystkie polecenia w kolejce są wykonywane. Podczas integrowania kodu śledzenia JavaScript Google Analytics z wtyczką lub usługą zawsze dbaj o utworzenie instancji kolejki i upewnij się, że integracja wypchnęła polecenie _trackSocial do tej tablicy.

var _gaq = _gaq || [];

To daje uzasadnioną pewność, że metoda zostanie wywołana niezależnie od tego, czy strona docelowa witryny korzysta z tradycyjnego czy asynchronicznego fragmentu kodu śledzenia.

Konfiguracje użytkownika

Jeśli tworzysz wtyczkę, która integruje Analytics wtyczki społecznościowej, rozważ udostępnienie tych opcji, które pozwolą użytkownikom określić, kiedy korzystają z Twojej wtyczki:

Ustawianie opcjonalnego parametru ścieżki do strony – ostatnim parametrem metody _trackSocial jest zastąpienie bieżącego adresu URL, z którego nastąpiła interakcja społecznościowa. Ostatnim celem jest raportowanie tych samych adresów URL między śledzeniem stron a narzędziem Analytics wtyczki społecznościowej. Niektórzy użytkownicy mogą zastąpić domyślny adres URL strony śledzony za pomocą śledzenia wyświetleń strony, dlatego potrzebują też sposobu na zastąpienie tego adresu w Statystykach wtyczek społecznościowych, aby uzyskać spójne raporty.

Oto przykład, jak możesz pozwolić użytkownikom na ustawianie tych opcji, i zobaczyć, jak Twój kod musi na nie zareagować.

// Create a function for a user to call to pass in the options.
function trackFacebook(opt_pagePath) {
  try {
    if (FB && FB.Event && FB.Event.subscribe) {
      FB.Event.subscribe('edge.create', function(targetUrl) {
        _gaq.push(['_trackSocial', 'facebook', 'like',
            opt_target, opt_pagePath]);
      });
    }
  } catch(e) {}
}

Jeśli w przykładzie powyżej funkcja trackFacebook zostanie wywołana z zestawem parametrów opt_pagePath, domyślna wartość ścieżki do strony zostanie zastąpiona ścieżką dostawców z parametru. W przeciwnym razie jego wartość będzie ustawiona na undefined. , a kod śledzenia Google Analytics użyje wartości domyślnej dla niezdefiniowanego parametru.

Uwaga: w tym przykładzie dodaliśmy też kilka testów, aby mieć pewność, że jeśli interfejs Facebook API nie zostanie wczytany, nie wystąpią błędy skryptu. Jako odpowiedzialny programista musisz zadbać o właściwą obsługę błędów.

Wiele trackerów

Niektórzy użytkownicy Google Analytics nazywają swój obiekt śledzenia tak, aby rozróżnić wiele modułów śledzenia na tej samej stronie. Chociaż nie zalecamy stosowania wielu skryptów śledzenia na tej samej stronie witryny, możesz rozważyć obsługę wielu skryptów śledzących.

Poniżej znajdziesz przykład iteracji i wywołania metody _trackSocial w przypadku każdego obiektu skryptu śledzenia. Używa metody _getTrackers, która zwraca tablicę wszystkich obiektów trackera na stronie.

W tym przykładzie po wywołaniu zdarzenia Facebooka metoda _trackSocial dla każdego obiektu śledzenia jest przekazywana do kolejki poleceń Google Analytics _gaq. 

getSocialActionTrackers = function(network, socialAction, opt_target, opt_pagePath) {
  return function() {
    var trackers = _gat._getTrackers();
    for (var i = 0, tracker; tracker = trackers[i]; i++) {
      tracker._trackSocial(network, socialAction, opt_target, opt_pagePath);
    }
  };
}

function trackFacebook(opt_pagePath) {
  try {
    if (FB && FB.Event && FB.Event.subscribe) {
      FB.Event.subscribe('edge.create', function(targetUrl) {
        _gaq.push(_ga.getSocialActionTrackers_('facebook', 'like',
            opt_target, opt_pagePath));
      });
    }
  } catch(e) {}
}