Soziale Interaktionen – Web-Tracking (ga.js)

In diesem Dokument wird beschrieben, wie Sie mit Google Analytics Interaktionsmesswerte in Werbenetzwerken von Drittanbietern wie Facebook und Twitter abrufen können. Verwenden Sie dieses Dokument, um Analytics für Ihre Teilen-Schaltflächen für soziale Netzwerke einzurichten, wenn Sie Websiteinhaber sind oder ein Content-Management-Plug-in entwickeln oder wenn Sie ein soziales Netzwerk sind und Nutzern Ihrer Freigabeschaltflächen automatische Berichte zu sozialen Interaktionen zur Verfügung stellen möchten.

Einleitung

Google Analytics bietet standardmäßig integrierte Berichte für die +1-Schaltfläche. Wenn Sie also ga.js und eine +1-Schaltfläche auf derselben Seite implementiert haben, werden alle +1-Interaktionen in sozialen Netzwerken automatisch gemeldet. Weitere Informationen zu +1-Analysen sowie Tipps zur Fehlerbehebung finden Sie in der Hilfe unter Über Analytics für soziale Interaktionen.

Wenn Sie Analysedaten zu sozialen Interaktionen und Berichte für andere Netzwerke wie Facebook oder Twitter erhalten möchten, müssen Sie jede Netzwerkschaltfläche mit Google Analytics verknüpfen. Mithilfe von Analytics für soziale Plug-ins reichen die aufgezeichneten Interaktionen von einem Facebook-„Gefällt mir“-Angabe bis hin zu einem Twitter-Tweet. Mit Ereignis-Tracking lassen sich zwar auch allgemeine Interaktionen mit Inhalten erfassen, die Analyse sozialer Netzwerke bietet jedoch ein einheitliches Framework für die Aufzeichnung sozialer Interaktionen. Auf diese Weise stehen Nutzern von Google Analytics-Berichten einheitliche Berichte zur Verfügung, mit denen sie die Interaktionen in sozialen Netzwerken über mehrere Netzwerke hinweg vergleichen können.

Ein funktionierendes Beispiel für die Einbindung von Analytics in Facebook- und Twitter-Schaltflächen finden Sie im Beispielcode für Social Analytics.

Analytics für soziale Interaktionen einrichten

Wenn Sie das Tracking für soziale Interaktionen einrichten möchten, müssen Sie die Methode _trackSocial verwenden, mit der Daten zu sozialen Interaktionen an Google Analytics gesendet werden. Die Methode sollte aufgerufen werden, sobald ein Nutzer eine soziale Interaktion abgeschlossen hat. Jedes soziale Netzwerk verwendet einen anderen Mechanismus, um zu bestimmen, wann die soziale Interaktion stattfindet. Dazu muss normalerweise die API für die entsprechende Netzwerkschaltfläche eingebunden werden.

Da die spezifischen Details für die Integration von Analysen sozialer Netzwerke je nach sozialem Netzwerk variieren, enthält der Rest dieses Leitfadens allgemeine Best Practices für die Einrichtung von Berichten zu sozialen Plug-ins für jedes dieser Netzwerke. Wir empfehlen, die Entwicklerdokumentation für jedes Netzwerk zu lesen, um die netzwerkspezifische Implementierung zu ermitteln.

Hier ist eine Beschreibung der _trackSocial-Methode:

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

Die Parameter stellen hierbei Folgendes dar:

  • network

    Erforderlich. String, der das erfasste soziale Netzwerk darstellt (z.B. Facebook, Twitter, LinkedIn).

  • socialAction

    Erforderlich. String, der die erfasste soziale Interaktion darstellt (z. B. Like, Share, Tweet)

  • opt_target

    Optional. Ein String, der die URL (oder Ressource) darstellt, die die Aktion empfängt. Wenn ein Nutzer beispielsweise auf einer Seite einer Website auf die Schaltfläche Gefällt mir klickt, kann die opt_target auf den Titel der Seite oder eine ID festgelegt werden, mit der die Seite in einem Content-Management-System identifiziert wird. In vielen Fällen ist die Seite, die Sie mit Gefällt mir markieren, dieselbe Seite, auf der Sie sich befinden. Wenn dieser Parameter also undefined ist oder weggelassen wird, wird im Tracking-Code standardmäßig document.location.href verwendet.

  • opt_pagePath

    Optional. Ein String, der die Seite nach Pfad (einschließlich Parametern) darstellt, über den die Aktion erfolgte. Wenn Sie beispielsweise auf der Seite https://developers.google.com/analytics/devguides/ auf die Schaltfläche Gefällt mir klicken, sollte opt_pagePath auf /analytics/devguides gesetzt werden. Fast immer ist der Pfad die Quelle der sozialen Interaktion. Wenn dieser Parameter also undefined ist oder weggelassen wird, wird im Tracking-Code standardmäßig location.pathname und location.search verwendet. Sie müssen dies in der Regel nur festlegen, wenn Sie virtuelle Seitenaufrufe erfassen. Ändern Sie dazu den optionalen Seitenpfadparameter mit der Google Analytics-Methode _trackPageview.

Facebook-Aktionen

Laut dem Facebook JavaScript SDK lässt sich die Schaltfläche Gefällt mir am einfachsten mit folgendem Code auf Ihrer Seite einrichten:

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

„Mag ich“-Bewertungen

Abonnieren Sie zum Aufzeichnen von „Gefällt mir“-Angaben mit Google Analytics das Facebook-Ereignis edge.create und erstellen Sie eine Callback-Funktion, um den Google Analytics-Tracking-Code auszuführen.

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

Wenn ein Nutzer Ihre Seite mit Gefällt mir markiert, wird die Callback-Funktion ausgeführt und empfängt die URL der Ressource, für die ein Like gegeben wurde. Die Ressource wird dann als Wert an die Methode _trackSocial übergeben, damit Google Analytics Berichte zum Netzwerk, zur Aktion und zur URL erstellen kann, die gefallen wurden.

„Mag ich“-Bewertungen

Mit den Facebook APIs kannst du auch andere interessante Ereignisse abonnieren, beispielsweise „Mag ich nicht“-Bewertungen.

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

Geteilte Inhalte

Sie können auch Geteilte Inhalte abonnieren.

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

Twitter-Tweets

Gemäß der Dokumentation zur Tweet-Schaltfläche und den Web Intents JavaScript-Ereignissen muss der folgende Code verwendet werden, um eine Twitter-Schaltfläche auf deiner Seite zu implementieren und Nutzerinteraktionen zu erkennen:

<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>

Wenn Sie Tweet-Button-Ereignisse mit Google Analytics erfassen möchten, müssen Sie die Web Intents JavaScript Events von Twitter verwenden und eine Callback-Funktion an Intent Event binden. Es ist wichtig, Ereignisbindungen in eine Callback-Funktion zu kapseln, um sicherzustellen, dass vor Bindungsereignissen alles geladen wurde.

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);
});

Wenn ein Nutzer einen Tweet sendet, empfängt die Callback-Funktion ein Objekt, mit dem normalerweise die URL der getwitterten Ressource abgerufen werden kann. Sobald der Twitter-JavaScript-Code geladen ist, wandelt er den mit Anmerkungen versehenen Tweet-Link in einen iFrame um. Die getwitterte URL wird codiert und als Abfrageparameter an die URL des iFrames angehängt. Das an unseren Callback übergebene Ereignisobjekt verweist auf diesen iFrame, den wir verwenden können, um die URL der im Tweet zu sendenden Ressource abzurufen.

Die obige Callback-Funktion sorgt dafür, dass der iFrame-Verweis auch wirklich ein iFrame ist. Anschließend versucht sie, die zu twitternde Ressource mithilfe des Abfrageparameters url zu extrahieren.

Hier ist eine Beispielfunktion zum Extrahieren eines Abfrageparameters aus einem 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;
}

Der Parameter wird zurückgegeben, wenn er im Abfragestring enthalten ist. Wenn kein Parameter gefunden wird, gibt die Funktion undefined zurück, das an die Methode _trackSocial übergeben wird, was zum Standardverhalten der Methode führt.

Best Practices für die Integration

Auf vielen Websites werden Schaltflächen für soziale Netzwerke mithilfe von Content-Management-Plug-ins hinzugefügt. Wenn Sie der Autor solcher Plug-ins sind, empfehlen wir Ihnen dringend, Analytics für soziale Plug-ins zu integrieren, damit diese Interaktionen automatisch erfasst werden. Ebenso können Entwickler in sozialen Netzwerken die Interaktionen in sozialen Netzwerken in Google Analytics leichter im Blick behalten, wenn Sie sie in Analytics für soziale Netzwerke einbinden.

In diesem Abschnitt werden Best Practices für die Einbindung von Analytics für soziale Plug-ins beschrieben, damit Interaktionen in Ihrem Produkt oder CMS automatisch erfasst werden. Ein funktionierendes Beispiel zu all diesen Best Practices finden Sie im Beispielcode für Analysen zu sozialen Plug-ins.

Instanziieren und Verwenden der _gaq-Warteschlange

Die neueste Version des Google Analytics-Tracking-Codes kann sowohl synchron als auch asynchron geladen werden. Damit Entwickler Methoden aufrufen können, die noch nicht geladen wurden, stellt Google Analytics die Befehlswarteschlange _gaq bereit, in die Tracking-Methoden per Push-Befehl _gaq.push(); übertragen werden können.

Sobald der Tracking-Code geladen ist, werden alle Befehle in der Warteschlange ausgeführt. Wenn Sie den JavaScript-Tracking-Code von Google Analytics in Ihr Plug-in oder Produkt einbinden, sollten Sie immer darauf achten, dass diese Befehlswarteschlange instanziiert wird und Ihre Integration den Befehl _trackSocial an dieses Array überträgt.

var _gaq = _gaq || [];

So ist sichergestellt, dass die Methode unabhängig davon aufgerufen wird, ob auf der empfangenden Seite der Website das herkömmliche oder asynchrone Tracking-Code-Snippet verwendet wird.

Nutzerkonfigurationen

Wenn Sie ein Plug-in entwickeln, das Analysen zu sozialen Plug-ins integriert, sollten Sie die folgenden Optionen zur Verfügung stellen, die Nutzer bei der Verwendung Ihres Plug-ins festlegen können:

Optionalen Seitenpfadparameter festlegen: Der letzte Parameter der _trackSocial-Methode besteht darin, die aktuelle URL zu überschreiben, über die eine soziale Interaktion erfolgt ist. Ziel ist es, dass im Seiten-Tracking und in Analysen zu sozialen Plug-ins dieselben URLs erfasst werden. Da einige Nutzer möglicherweise die standardmäßige Seiten-URL überschreiben, die mit dem Seitenaufruf-Tracking erfasst wird, müssen sie auch die URL in Analytics für soziale Plug-ins überschreiben können, um konsistente Berichte zu erhalten.

Im Folgenden findest du ein Beispiel dafür, wie du es Nutzern ermöglichen kannst, diese Optionen festzulegen. Außerdem siehst du, wie dein Code darauf reagieren muss.

// 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) {}
}

Wenn im obigen Beispiel die Funktion trackFacebook mit festgelegtem opt_pagePath-Parameter aufgerufen wird, wird der Standardseitenpfadwert mit dem Quellpfad des Parameters überschrieben. Andernfalls wird der Wert für diesen Parameter auf undefined gesetzt. und der Google Analytics-Tracking-Code verwendet den Standardwert für den nicht definierten Parameter.

Hinweis: In diesem Beispiel wurden außerdem einige Prüfungen hinzugefügt, um sicherzustellen, dass keine Skriptfehler auftreten, wenn die Facebook API nicht geladen wurde. Als verantwortungsbewusster Entwickler sollten Sie darauf achten, Fehler entsprechend zu beheben.

Mehrere Tracker

Einige Google Analytics-Nutzer benennen ihr Tracking-Objekt, um mehrere Tracker auf derselben Seite zu unterscheiden. Wir raten zwar davon ab, mehrere Tracker auf derselben Website zu verwenden, du kannst aber auch mehrere Tracker verwenden.

Das folgende Beispiel zeigt, wie die _trackSocial-Methode für jedes Tracker-Objekt iteriert und aufgerufen wird. Sie verwendet die Methode _getTrackers, die ein Array aller Tracker-Objekte auf der Seite zurückgibt.

Wenn in diesem Beispiel das Facebook-Ereignis ausgelöst wird, wird die Methode _trackSocial für jedes Tracker-Objekt der Google Analytics-Befehlswarteschlange _gaq hinzugefügt. 

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) {}
}