Sosyal Medya Etkileşimleri - Web İzleme (ga.js)

Bu dokümanda, Facebook ve Twitter gibi Google dışı ağlarda etkileşim metriklerini almak için Google Analytics'in nasıl kullanılacağı açıklanmaktadır. Site sahibi, içerik yönetimi eklentisi geliştiricisi veya paylaşım düğmelerinizin kullanıcılarına otomatik sosyal medya etkileşimi raporları sunmak isteyen bir sosyal ağ operatörüyseniz, sosyal medya paylaşım düğmeleriniz için Analytics'i kurmak için bu dokümanı kullanın.

Giriş

Varsayılan olarak Google Analytics, +1 Düğmesi için entegre raporlama sağlar. Bu, aynı sayfaya ga.js ve +1 Düğmesi uyguladıysanız tüm +1 sosyal medya etkileşimlerinin otomatik olarak raporlanacağı anlamına gelir. Sorun giderme ipuçları dahil olmak üzere +1 Analizi hakkında daha fazla bilgi için Yardım Merkezi'ndeki Sosyal Medya Analizleri Hakkında bölümüne bakın.

Sosyal medya etkileşimiyle ilgili Analytics ve Facebook veya Twitter gibi diğer ağlara ilişkin raporlar almak için Google Analytics'i her bir ağ düğmesine entegre etmeniz gerekir. Sosyal Medya Eklentisi Analizi ile kaydedilen etkileşimler, Facebook "Beğen"inden Twitter "Tweet'ine" kadar değişiklik gösterir. Etkinlik izleme genel içerik etkileşimlerini de izleyebilirken Sosyal Analytics, sosyal medya etkileşimlerini kaydetmek için tutarlı bir çerçeve sunar. Bu da Google Analytics rapor kullanıcılarına, birden fazla ağdaki sosyal ağ etkileşimlerini karşılaştırmaları için tutarlı bir rapor kümesi sunar.

Analytics'in Facebook ve Twitter düğmeleriyle nasıl entegre edileceğine dair çalışan bir örnek görmek için Sosyal Medya Analizi örnek koduna göz atın.

Sosyal Medya Analizi Kurulumu

Sosyal medya etkileşimleri izlemeyi ayarlamak için, sosyal medya etkileşimi verilerini Google Analytics'e gönderen _trackSocial yöntemini kullanmanız gerekir. Yöntem, kullanıcı bir sosyal etkileşimi tamamladıktan sonra çağrılmalıdır. Her sosyal ağ, sosyal medya etkileşiminin ne zaman gerçekleşeceğini belirlemek için farklı bir mekanizma kullanır ve bu genellikle söz konusu ağ düğmesinin API ile entegre edilmesini gerektirir.

Sosyal Analytics'i entegre etmeye ilişkin belirli ayrıntılar sosyal ağa göre değiştiğinden, bu kılavuzun geri kalanında bu ağların her biri için Sosyal Medya Eklentisi Analizi'nin nasıl kurulacağıyla ilgili genel en iyi uygulamalar sunulmaktadır. Ağa özgü uygulamayı anlamak için her bir ağın geliştirici belgelerini incelemenizi öneririz.

_trackSocial yönteminin açıklamasını aşağıda bulabilirsiniz:

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

Burada parametreler:

  • network

    Zorunlu. İzlenmekte olan sosyal ağı temsil eden bir dize (ör. Facebook, Twitter, LinkedIn).

  • socialAction

    Zorunlu. İzlenmekte olan sosyal medya işlemini (ör. Beğen, Paylaş, Tweet) temsil eden bir dize.

  • opt_target

    İsteğe bağlı. İşlemi alan URL'yi (veya kaynağı) temsil eden bir dize. Örneğin, kullanıcı sitedeki bir sayfada Beğen düğmesini tıklarsa opt_target özelliği, sayfanın başlığı veya içerik yönetim sisteminde sayfayı tanımlamak için kullanılan bir kimlik olarak ayarlanabilir. Çoğu durumda, Beğendiğiniz sayfa, bulunduğunuz sayfayla aynıdır. Dolayısıyla, bu parametre undefined ise veya atlanırsa izleme kodu varsayılan olarak document.location.href değerini kullanır.

  • opt_pagePath

    İsteğe bağlı. İşlemin gerçekleştiği yola göre sayfayı (parametreler dahil) temsil eden bir dize. Örneğin, https://developers.google.com/analytics/devguides/ adresinde Beğen düğmesini tıklarsanız opt_pagePath, /analytics/devguides olarak ayarlanmalıdır. Sayfanın yolu, neredeyse her zaman sosyal medya işleminin kaynağıdır. Dolayısıyla, bu parametre undefined olursa veya atlanırsa izleme kodu varsayılan olarak location.pathname ve location.search kullanır. Genellikle bunu yalnızca isteğe bağlı sayfa yolu parametresini Google Analytics _trackPageview yöntemiyle değiştirerek sanal sayfa görüntülemelerini izliyorsanız gereklidir.

Facebook İşlemleri

Facebook JavaScript SDK'sına göre sayfanızda bir Beğen düğmesi oluşturmanın en basit yolu şu kodu kullanmaktır:

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

Beğeni sayısı

Google Analytics ile Beğenileri kaydetmek için Facebook'un edge.create etkinliğine abone olun ve Google Analytics izleme kodunu yürütmek üzere bir geri çağırma işlevi oluşturun.

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

Bir kullanıcı sayfanızı Beğendiğinde, geri çağırma işlevi yürütülür ve beğenilan kaynağın URL'sini alır. Daha sonra kaynak, Google Analytics'in beğenilen ağ, işlem ve URL hakkında rapor oluşturabilmesi için _trackSocial yöntemine değer olarak iletilir.

Beğenmemeler

Facebook API'leri beğenmemeler gibi diğer ilginç etkinliklere abone olmanıza da olanak tanır.

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

Paylaşımlar

Paylaşımlara da abone olabilirsiniz.

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

Twitter Tweet'leri

Tweet Düğmesi Belgeleri'ne ve Web Amaçları JavaScript Etkinlikleri'ne göre sayfanıza twitter düğmesi eklemek ve kullanıcı etkileşimlerini algılamak için aşağıdaki kod kullanılmalıdır:

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

Tweet Düğmesi etkinliklerini Google Analytics ile izlemek için Twitter'ın Web Amaçları JavaScript Etkinlikleri'ni kullanmanız ve Intent Event öğesine bir geri çağırma işlevi bağlamanız gerekir. Bağlama etkinliklerinden önce her şeyin yüklendiğinden emin olmak için etkinlik bağlamalarını bir geri çağırma işlevinde sarmalamak önemlidir.

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

Bir kullanıcı Tweet gönderdiğinde geri çağırma işlevi, genellikle tweet'lenen kaynağın URL'sini almak için kullanılabilen bir nesne alır. Twitter JavaScript kodu yüklendikten sonra, ek açıklamalı tweet bağlantısını bir iframe'e dönüştürür ve tweet'lenen URL kodlanır ve iframe'in URL'sine bir sorgu parametresi olarak eklenir. Geri çağırmamıza iletilen etkinlik nesnesi, bu iframe'e bir referans içeriyor ve bunu, tweet'lenen kaynağın URL'sini almak için kullanabiliriz.

Yukarıdaki geri çağırma işlevi, iframe referansının gerçekten bir iframe olduğundan emin olmanızı sağlar ve ardından url sorgu parametresine bakarak tweet'lenen kaynağı çıkarmaya çalışır.

Aşağıda, URI'dan sorgu parametresi almak için kullanılabilecek bir örnek işlev verilmiştir:

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

Parametre, sorgu dizesinde yer alıyorsa döndürülür. Herhangi bir parametre bulunamazsa işlev, undefined yöntemini döndürür. Bu değer, _trackSocial yöntemine aktarılır ve yöntem için varsayılan davranış ortaya çıkar.

Entegrasyon için En İyi Uygulamalar

Birçok site, içerik yönetimi eklentilerini kullanarak sosyal düğmeler ekler. Bu tür eklentilerin yazarıysanız bu etkileşimleri otomatik olarak kaydetmek için Sosyal Medya Eklentisi Analizi'ni entegre etmenizi önemle tavsiye ederiz. Benzer şekilde, Sosyal Ağda geliştiriciyseniz Sosyal Analytics entegrasyonuyla kullanıcıların Google Analytics'teki sosyal ağ etkileşimlerinizi izlemelerini de çok kolaylaştırabilirsiniz.

Size yardımcı olmak amacıyla bu bölümde, ürününüzün veya İYS'nizin sosyal medya etkileşimlerini otomatik olarak izlemesi için Sosyal Medya Eklentisi Analizi'ni entegre etmeyle ilgili en iyi uygulamalar açıklanmaktadır. Tüm bu en iyi uygulamaların çalışan bir örneğini görmek için Sosyal Medya Eklentisi Analizi örnek koduna göz atın.

_gaq Sırasını Örnekleme ve Kullanma

Google Analytics izleme kodunun en son sürümü, hem eşzamanlı hem de eşzamansız olarak yüklenmeyi destekler. Google Analytics, geliştiricilerin henüz yüklenmemiş yöntemleri çağırmasını sağlamak için, izleme yöntemlerinin _gaq.push(); aktarılabileceği bir komut sırası _gaq sağlar.

İzleme kodu yüklendikten sonra, sıradaki tüm komutlar yürütülür. Google Analytics JavaScript izleme kodunu eklentinize veya ürününüze entegre ederken daima bu komut sırasının gösterilmesi ve entegrasyonunuzun _trackSocial komutunu bu diziye aktarması gerekir.

var _gaq = _gaq || [];

Bu, alıcı web sitesi sayfasının geleneksel veya eşzamansız izleme kod snippet'ini kullanmasına bakılmaksızın yöntemin çağrılacağına dair makul düzeyde garanti verir.

Kullanıcı Yapılandırmaları

Sosyal Medya Eklentisi Analizi'ni entegre eden bir eklenti geliştiriyorsanız, kullanıcıların eklentinizi kullanırken ayarlayabilecekleri aşağıdaki seçenekleri sağlamayı göz önünde bulundurmalısınız:

İsteğe bağlı sayfa yolu parametresini ayarlama — _trackSocial yönteminin son parametresi, sosyal medya etkileşiminin gerçekleştiği geçerli URL'yi geçersiz kılmaktır. Nihai hedef, sayfa izleme ile Sosyal Medya Eklentisi Analizi arasında aynı URL'lerin raporlanmasını sağlamaktır. Bazı kullanıcılar, sayfa görüntüleme izlemeyle izlenen varsayılan sayfa URL'sini geçersiz kılabildiğinden, tutarlı raporlama sağlamak için Sosyal Medya Eklentisi Analizi'nde URL'yi geçersiz kılma yöntemi de gerekir.

Kullanıcıların bu seçenekleri belirlemelerine nasıl izin vereceğiniz ve kodunuzun bunlara nasıl yanıt vermesi gerektiği konusunda bir örneği aşağıda bulabilirsiniz.

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

Yukarıdaki örnekte, trackFacebook işlevi opt_pagePath parametresi ayarlanmış olarak çağrılırsa parametredeki kaynak yolu değeri, varsayılan sayfa yolu değerinin üzerine yazılır. Aksi takdirde, bu parametrenin değeri undefined olarak ayarlanır. ve Google Analytics izleme kodu, tanımlanmamış parametre için varsayılan değeri kullanır.

Not: Bu örnekte, Facebook API'nin yüklenmemesi durumunda komut dosyası hatası oluşmaması için birkaç kontrol de eklenmiştir. Sorumlu bir geliştirici olarak hataları uygun şekilde ele aldığınızdan emin olmanız gerekir.

Birden Fazla İzleyici

Bazı Google Analytics kullanıcıları, izleme nesnelerine aynı sayfada birden fazla izleyiciyi ayırt etmek için ad verir. Aynı web sitesi sayfasında birden fazla izleyici kullanılmasını önermesek de, birden fazla izleyiciyle ilgilenmeyi düşünebilirsiniz.

Aşağıda, her bir izleyici nesnesi için _trackSocial yöntemini yineleme ve çağırma ile ilgili bir örnek verilmiştir. Bu parametre, sayfadaki tüm izleyici nesnelerinin bir dizisini döndüren _getTrackers yöntemini kullanır.

Bu örnekte, Facebook etkinliği tetiklendiğinde her izleyici nesnesi için _trackSocial yöntemi Google Analytics komut sırasına _gaq aktarılır. 

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