Google Analytics के साथ सामग्री जुड़ाव ट्रैक करें

डिफ़ॉल्ट रूप से, Google Analytics में, साइट सामग्री के साथ आगंतुकों के इंटरैक्शन को ट्रैक करना काफी सरल है। मानक ट्रैकिंग कोड का उपयोग करके, आप विभिन्न जानकारी प्राप्त कर सकते हैं जैसे: पृष्ठ पर आगंतुक द्वारा खर्च किया गया समय (साइट पर समय), बाउंस दर और पृष्ठदृश्य।

लेकिन कभी-कभी यह डेटा पर्याप्त नहीं हो सकता है। उदाहरण के लिए, ब्लॉगर्स या साइटों के लिए जहां लेखों और विभिन्न प्रकाशनों में मुख्य सामग्री होती है, ये मैट्रिक्स पर्याप्त नहीं हो सकते हैं।

हम प्रत्येक संदेश या लेख के लिए अधिक विस्तृत जानकारी प्राप्त करना चाहते हैं। क्या लोग टिप्पणी या सिर्फ पोस्ट, लेख पढ़ते हैं? क्या वे टैब में कई पोस्ट खोलते हैं?
प्रत्येक पृष्ठ के साथ वेबसाइट के विज़िटर कैसे बातचीत करते हैं, इसके बारे में विस्तृत जानकारी प्राप्त करने का सबसे अच्छा तरीका क्या है?

यह लेख कस्टम Google Analytics ट्रैकिंग कोड (GA) का उपयोग करके सामग्री के साथ सगाई की डिग्री को मापने के तरीके के बारे में है।

व्यावसायिक लक्ष्य

जैसा कि हमने ऊपर उल्लेख किया है, हमारा लक्ष्य इस बात का बेहतर विचार प्राप्त करना है कि आगंतुक साइट के प्रत्येक पृष्ठ के साथ कैसे बातचीत करते हैं। थॉमस बाकदल द्वारा प्रस्तावित लक्ष्यों का उपयोग करके हम ट्रैक करेंगे:

• कितने लोग पृष्ठ को स्क्रॉल करते हैं;
• जब कोई व्यक्ति स्क्रॉल करना शुरू करता है;
• जब कोई व्यक्ति लेख के अंत तक पहुँचता है (पृष्ठ के अंत में नहीं, लेकिन वह क्षेत्र जहाँ लेख या संदेश समाप्त होता है);
• कौन से आगंतुक बस लेखों को देखते हैं, और जो उन्हें पढ़ते हैं।

महत्व के बारे में सोचो! हम वास्तव में पढ़े गए लेखों की संख्या को सही ढंग से मापने में सक्षम होंगे। हम यह भी देख सकते हैं कि कौन से लेख आगंतुक टिप्पणियों को पढ़ते हैं और पृष्ठ के अंत तक पहुंचते हैं।

ट्रैकिंग तकनीक

उपरोक्त सभी को मानक GA इवेंट ट्रैकिंग फ़ंक्शन का उपयोग करके ट्रैक किया जा सकता है। लब्बोलुआब यह है कि हम कुछ निश्चित क्रिया होने पर घटनाओं को पंजीकृत करेंगे। हम आगंतुकों द्वारा पृष्ठ पर स्क्रॉल करने के आधार पर घटनाओं को पंजीकृत करेंगे।

जीए इवेंट ट्रैकिंग फ़ंक्शन में पांच घटक शामिल हैं: श्रेणी, कार्रवाई, लेबल, मूल्य, और छिपे हुए काउंटर (श्रेणी, कार्रवाई, लेबल, मूल्य, निहित गणना)। हमें उस डेटा को परिभाषित करने की आवश्यकता है जिसे हम GA रिपोर्ट में देखना चाहते हैं।

हम एक श्रेणी में पढ़ने से संबंधित सभी गतिविधियों को एकजुट करेंगे और इस श्रेणी को रीडिंग कहेंगे।

इस श्रेणी में चार मुख्य कार्य होंगे:

• लेख लोड: यह मापेगा कि ब्राउज़र में लेख कितनी बार लोड किया गया था। सामान्य तौर पर, यह पृष्ठ दृश्य (मानक पृष्ठ साक्षात्कार) की संख्या के लिए एक और काउंटर है। यह घटना हमें अन्य घटनाओं के संदर्भ को समझने में मदद करेगी जिन्हें हम ट्रैक करने वाले हैं;
• पढ़ना शुरू करें: जब कोई आगंतुक किसी पृष्ठ को नीचे स्क्रॉल करता है तो ट्रैक करता है। यह तब होता है जब आगंतुक पृष्ठ पर 150 पिक्सेल नीचे स्क्रॉल करता है। इस मान को बदला जा सकता है। यह पेज स्क्रॉलिंग की शुरुआत के बाद कितना समय बीत जाता है, इस पर भी नज़र रखता है;
• कंटेंट बॉटम: ट्रैक जब कोई विज़िटर आर्टिकल के अंत तक पहुँचता है और ट्रैक करता है कि आर्टिकल के शुरू से अंत तक स्क्रॉल करने में कितना समय लगता है;
• पृष्ठ का निचला भाग: जब कोई आगंतुक पृष्ठ के अंत तक पहुँच गया है और उसे कितना समय लगा है, इस पर नज़र रखता है।

हमारे लिए अन्य महत्वपूर्ण जानकारी शीर्षक और पृष्ठ URL है। आगंतुकों के लिए सबसे दिलचस्प लेखों की पहचान करने के लिए हमें इन आंकड़ों की आवश्यकता है और कौन से लेख दर्शकों की आगे की भागीदारी को प्रभावित करते हैं। जीए स्वचालित रूप से URL और पेज शीर्षक को ट्रैक करता है, इसलिए इसे घटनाओं में जोड़ने की आवश्यकता नहीं है।

हम समूहों द्वारा आगंतुकों को अलग करने के लिए एक कस्टम चर का भी उपयोग करेंगे। यदि पेज के अंत तक पहुंचने में विज़िटर को 60 सेकंड से कम समय लगता है, तो हम इस विज़िटर को स्कैनर्स ग्रुप को असाइन करते हैं। लेकिन अगर पृष्ठ के अंत तक पहुंचने में आगंतुक को 60 सेकंड से अधिक समय लगा, तो उसे रीडर्स समूह में डाल दिया।

अंत में, हम घटनाओं को लक्ष्य के रूप में सेट करेंगे। हम उन लोगों के लिए एक लक्ष्य निर्धारित करेंगे जो लेख के अंत तक पहुँच चुके हैं, और उन लोगों के लिए एक लक्ष्य जो पृष्ठ के अंत तक पहुँच चुके हैं। इन गतिविधियों को पूरा करने वाले आगंतुकों का प्रतिशत प्राप्त करने का यह एक आसान तरीका है।

कोड

सबसे पहले, हम jQuery लाइब्रेरी का उपयोग करेंगे। सुनिश्चित करें कि आपकी साइट पर jQuery लाइब्रेरी सक्षम है।

निम्नलिखित कोड है, इसे कॉपी, संशोधित या साझा करने के लिए स्वतंत्र महसूस करें। बस उन लोगों को मत भूलिए जिन्होंने इस कोड में योगदान दिया है!

 jQuery(function($) { // Debug flag var debugMode = true; // Default time delay before checking location var callBackTime = 100; // # px before tracking a reader var readerLocation = 150; // Set some flags for tracking & execution var timer = 0; var scroller = false; var endContent = false; var didComplete = false; // Set some time variables to calculate reading time var startTime = new Date(); var beginning = startTime.getTime(); var totalTime = 0; // Track the aticle load if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'ArticleLoaded', '', , true]); } // Check the location and track user function trackLocation() { bottom = $(window).height() + $(window).scrollTop(); height = $(document).height(); // If user starts to scroll send an event if (bottom > readerLocation && !scroller) { currentTime = new Date(); scrollStart = currentTime.getTime(); timeToScroll = Math.round((scrollStart - beginning) / 1000); if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'StartReading', '', timeToScroll]); } else { alert('started reading ' + timeToScroll); } scroller = true; } // If user has hit the bottom of the content send an event if (bottom >= $('.entry-content').scrollTop() + $('.entry-content').innerHeight() && !endContent) { currentTime = new Date(); contentScrollEnd = currentTime.getTime(); timeToContentEnd = Math.round((contentScrollEnd - scrollStart) / 1000); if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'ContentBottom', '', timeToContentEnd]); } else { alert('end content section '+timeToContentEnd); } endContent = true; } // If user has hit the bottom of page send an event if (bottom >= height && !didComplete) { currentTime = new Date(); end = currentTime.getTime(); totalTime = Math.round((end - scrollStart) / 1000); if (!debugMode) { if (totalTime < 60) { _gaq.push(['_setCustomVar', 5, 'ReaderType', 'Scanner', 2]); } else { _gaq.push(['_setCustomVar', 5, 'ReaderType', 'Reader', 2]); } _gaq.push(['_trackEvent', 'Reading', 'PageBottom', '', totalTime]); } else { alert('bottom of page '+totalTime); } didComplete = true; } } // Track the scrolling and track location $(window).scroll(function() { if (timer) { clearTimeout(timer); } // Use a buffer so we don't call trackLocation too often. timer = setTimeout(trackLocation, callBackTime); }); }); 
 

jQuery(function($) { // Debug flag var debugMode = true; // Default time delay before checking location var callBackTime = 100; // # px before tracking a reader var readerLocation = 150; // Set some flags for tracking & execution var timer = 0; var scroller = false; var endContent = false; var didComplete = false; // Set some time variables to calculate reading time var startTime = new Date(); var beginning = startTime.getTime(); var totalTime = 0; // Track the aticle load if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'ArticleLoaded', '', , true]); } // Check the location and track user function trackLocation() { bottom = $(window).height() + $(window).scrollTop(); height = $(document).height(); // If user starts to scroll send an event if (bottom > readerLocation && !scroller) { currentTime = new Date(); scrollStart = currentTime.getTime(); timeToScroll = Math.round((scrollStart - beginning) / 1000); if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'StartReading', '', timeToScroll]); } else { alert('started reading ' + timeToScroll); } scroller = true; } // If user has hit the bottom of the content send an event if (bottom >= $('.entry-content').scrollTop() + $('.entry-content').innerHeight() && !endContent) { currentTime = new Date(); contentScrollEnd = currentTime.getTime(); timeToContentEnd = Math.round((contentScrollEnd - scrollStart) / 1000); if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'ContentBottom', '', timeToContentEnd]); } else { alert('end content section '+timeToContentEnd); } endContent = true; } // If user has hit the bottom of page send an event if (bottom >= height && !didComplete) { currentTime = new Date(); end = currentTime.getTime(); totalTime = Math.round((end - scrollStart) / 1000); if (!debugMode) { if (totalTime < 60) { _gaq.push(['_setCustomVar', 5, 'ReaderType', 'Scanner', 2]); } else { _gaq.push(['_setCustomVar', 5, 'ReaderType', 'Reader', 2]); } _gaq.push(['_trackEvent', 'Reading', 'PageBottom', '', totalTime]); } else { alert('bottom of page '+totalTime); } didComplete = true; } } // Track the scrolling and track location $(window).scroll(function() { if (timer) { clearTimeout(timer); } // Use a buffer so we don't call trackLocation too often. timer = setTimeout(trackLocation, callBackTime); }); });

चलो एक सरल चर घोषणा के साथ शुरू करते हैं। कृपया ध्यान दें कि कुछ चर के मूल्य बदल सकते हैं और उन्हें बदलना चाहिए।

  // Debug flag // CHANGE THIS TO false BEFORE INSTALLING var debugMode = true; // Default time delay before checking location var callBackTime = 100; // # px before tracking a reader var readerLocation = 150; // Set some flags for tracking & execution var timer = 0; var scroller = false; var endContent = false; var didComplete = false; // Set some time variables to calculate reading time var startTime = new Date(); var beginning = startTime.getTime(); var totalTime = 0; 
 

// Debug flag // CHANGE THIS TO false BEFORE INSTALLING var debugMode = true; // Default time delay before checking location var callBackTime = 100; // # px before tracking a reader var readerLocation = 150; // Set some flags for tracking & execution var timer = 0; var scroller = false; var endContent = false; var didComplete = false; // Set some time variables to calculate reading time var startTime = new Date(); var beginning = startTime.getTime(); var totalTime = 0;

आप callBackTime को बदल सकते हैं। callbackTime वह समय (मिलीसेकंड में) है जो ब्राउज़र स्क्रॉल बार की स्थिति की जांच करने से पहले प्रतीक्षा करेगा। किसी भी स्क्रॉल विलंब को छोड़कर।

readerLocation पिक्सेल में readerLocation दूरी है जिसे आगंतुक को इस घटना पर विचार करने से पहले स्क्रॉल करना चाहिए और इसे पढ़ने की शुरुआत के रूप में वर्गीकृत करना चाहिए।

अब अनुच्छेद लोड कार्रवाई:

 // Track the aticle load if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'ArticleLoaded', '', , true]); } 
 

// Track the aticle load if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'ArticleLoaded', '', , true]); }

अगला कोड है जो स्थिति की जांच करता है। सबसे पहले, डेटा एकत्र किया जाता है जहां आगंतुक पृष्ठ पर है और उसने कितनी दूर स्क्रॉल किया है।

 bottom = $(window).height() + $(window).scrollTop(); height = $(document).height(); 
 

bottom = $(window).height() + $(window).scrollTop(); height = $(document).height();

फिर हम जाँच शुरू करते हैं।

पहले, जांचें कि क्या आगंतुक ने पहली घटना के लिए पर्याप्त स्क्रॉल किया है (उदाहरण के लिए, 150 पिक्सेल)।

 // If user starts to scroll send an event if (bottom > readerLocation && !scroller) { currentTime = new Date(); scrollStart = currentTime.getTime(); timeToScroll = Math.round((scrollStart – beginning) / 1000); if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'StartReading', '', timeToScroll]); } else { alert('started reading ' + timeToScroll); } scroller = true; } 
 

// If user starts to scroll send an event if (bottom > readerLocation && !scroller) { currentTime = new Date(); scrollStart = currentTime.getTime(); timeToScroll = Math.round((scrollStart – beginning) / 1000); if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'StartReading', '', timeToScroll]); } else { alert('started reading ' + timeToScroll); } scroller = true; }

नोट: उपरोक्त घटना आपके उछाल दर को बदल देगी। जैसे ही कोई पृष्ठ को स्क्रॉल करना शुरू करता है, हम इसे विफलता नहीं मानते हैं। इस प्रकार, यह घटना विफलता दर को कम कर देगी। यह ध्यान दिया जाना चाहिए कि इन घटनाओं से साइट पर समय बदल जाएगा। आप देखेंगे कि आपकी साइट पर समय बढ़ता जाएगा।

इसके अलावा, अगर आगंतुक लेख के अंत तक पहुँचता है (हम उस div की जाँच करते हैं जिसमें लेख शामिल है), तो हम इसे एक घटना मानते हैं।

 // If user has hit the bottom of the content send an event if (bottom >= $('.entry-content').scrollTop() + $('.entry-content').innerHeight() && !endContent) { currentTime = new Date(); contentScrollEnd = currentTime.getTime(); timeToContentEnd = Math.round((contentScrollEnd – scrollStart) / 1000); if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'ContentBottom', '', timeToContentEnd]); } else { alert('end content section '+timeToContentEnd); } endContent = true; } 
 

// If user has hit the bottom of the content send an event if (bottom >= $('.entry-content').scrollTop() + $('.entry-content').innerHeight() && !endContent) { currentTime = new Date(); contentScrollEnd = currentTime.getTime(); timeToContentEnd = Math.round((contentScrollEnd – scrollStart) / 1000); if (!debugMode) { _gaq.push(['_trackEvent', 'Reading', 'ContentBottom', '', timeToContentEnd]); } else { alert('end content section '+timeToContentEnd); } endContent = true; }

यह ध्यान रखना महत्वपूर्ण है कि उपरोक्त कोड एक ब्लॉग के लिए है जहां लेख वाले div को entry-content कहा जाता entry-content । तो देखिए आपके ब्लॉग पर कौन सा div का लेख है।

अंत में, हम पृष्ठ के अंत तक पहुंचने वाले आगंतुकों को ट्रैक करते हैं। आगे, हम कुछ बातें करते हैं:

• हम मानते हैं कि आगंतुक को कितना समय लगा;
• घटनाओं को भेजें;
• हम उपयोगकर्ता चर का उपयोग करते हैं जिसे हमें समूह आगंतुकों के लिए आवश्यक है। यदि आगंतुक पूरे पृष्ठ को देखने के लिए 60 सेकंड से अधिक खर्च करता है, तो हम उसे रीडर्स समूह में डालते हैं। यदि आगंतुक 60 सेकंड से कम खर्च करता है, तो हम उसे स्कैनर्स ग्रुप में डालते हैं।

हम इस वेरिएबल को यूजर वेरिएबल के 5 वें स्लॉट में स्टोर करते हैं, क्योंकि यह हमारा फ्री स्लॉट है। आप किसी भी अन्य मुफ्त स्लॉट का उपयोग कर सकते हैं। कस्टम चर के बारे में यहाँ और पढ़ें।

 // If user has hit the bottom of page send an event if (bottom >= height && !didComplete) { currentTime = new Date(); end = currentTime.getTime(); totalTime = Math.round((end – scrollStart) / 1000); if (!debugMode) { if (totalTime < 60) { _gaq.push(['_setCustomVar', 5, 'ReaderType', 'Scanner', 2]); } else { _gaq.push(['_setCustomVar', 5, 'ReaderType', 'Reader', 2]); } _gaq.push(['_trackEvent', 'Reading', 'PageBottom', '', totalTime]); } else { alert('bottom of page '+totalTime); } didComplete = true; } 
 

// If user has hit the bottom of page send an event if (bottom >= height && !didComplete) { currentTime = new Date(); end = currentTime.getTime(); totalTime = Math.round((end – scrollStart) / 1000); if (!debugMode) { if (totalTime < 60) { _gaq.push(['_setCustomVar', 5, 'ReaderType', 'Scanner', 2]); } else { _gaq.push(['_setCustomVar', 5, 'ReaderType', 'Reader', 2]); } _gaq.push(['_trackEvent', 'Reading', 'PageBottom', '', totalTime]); } else { alert('bottom of page '+totalTime); } didComplete = true; }

चूंकि हम पृष्ठ पर बिताए गए समय को रिकॉर्ड करते हैं, इसलिए हम अपने माप की सटीकता बढ़ाने के लिए इस डेटा का उपयोग कर सकते हैं। हमने 60 सेकंड यादृच्छिक पर चुना। एक बार पर्याप्त डेटा जमा हो जाने के बाद, इस मान को समायोजित किया जा सकता है।

और अंत में, एक कोड जो यह जांचता है कि आगंतुक पृष्ठ के अंत तक स्क्रॉल किया है या नहीं:

 // Track the scrolling and track location $(window).scroll(function() { if (timer) { clearTimeout(timer); } // Use a buffer so we don't call trackLocation too often. timer = setTimeout(trackLocation, callBackTime); }); 
 

// Track the scrolling and track location $(window).scroll(function() { if (timer) { clearTimeout(timer); } // Use a buffer so we don't call trackLocation too often. timer = setTimeout(trackLocation, callBackTime); });

वह पूरा कोड है। आप इसे यहाँ कॉपी कर सकते हैं और यदि चाहें तो अपनी साइट पर पोस्ट कर सकते हैं।

लेखक का आभार:
निक मिहेलोव्स्की - Google पर एक डेवलपर (लेखक के सामने बैठकर)
थॉमस बेकडाल एक स्मार्ट लड़का है और www.baekal.com पर प्रकाशित होता है
अविनाश कौशिक - अगर आप नहीं जानते कि यह कौन है ...
Joost de Valk - वर्डप्रेस के लिए Google Analytics का निर्माता
Eivind Savio - ब्लॉगर और GA सलाहकार
स्रोत (अंग्रेजी में मूल): http://cutroni.com/blog/2012/02/21/advanced-content-tracking-with-google-analytics-part-1/