এই পৃষ্ঠাটি বর্ণনা করে যে কীভাবে আপনার সাইট থেকে Google Analytics-এ ডেটা পাঠাতে gtag.js কমান্ড ব্যবহার করতে হয়।
event কমান্ড দিয়ে ডেটা পাঠান
একবার আপনি একটি ওয়েব পৃষ্ঠায় গ্লোবাল স্নিপেট যোগ করলে , Google Analytics-এ ডেটা পাঠাতে event কমান্ড ব্যবহার করুন। উদাহরণস্বরূপ, একজন ব্যবহারকারী তাদের Google অ্যাকাউন্ট ব্যবহার করে সাইন ইন করেছেন তা নির্দেশ করতে নিম্নলিখিত event কমান্ডটি ব্যবহার করুন:
gtag('event', 'login', {'method': 'Google'});
API রেফারেন্সে event কমান্ড সম্পর্কে আরও জানুন।
গোষ্ঠী এবং বৈশিষ্ট্যে ডেটা রুট করুন
আপনি এক বা একাধিক Google Analytics প্রপার্টি আইডিতে পরিমাপের তথ্যের একটি সেট এবং অন্যান্য সম্পত্তি আইডিতে তথ্যের আরেকটি সেট পাঠাতে পারেন। আপনি বৈশিষ্ট্যগুলিকে গোষ্ঠীতে সংগঠিত করতে পারেন এবং তাদের কাছে ডেটা রুট করতে পারেন।
উদাহরণ স্বরূপ, নিম্নলিখিত কোডের উদাহরণে দেখানো হয়েছে কিভাবে একটি sign_in ইভেন্টকে একটি গ্রুপ 'এজেন্সি'-এ রুট করা যায় যাতে দুটি Google Analytics বৈশিষ্ট্য রয়েছে।
// Configure a target
gtag('config', 'GA_MEASUREMENT_ID_1');
gtag('config', 'GA_MEASUREMENT_ID_2', { 'groups': 'agency' });
gtag('config', 'GA_MEASUREMENT_ID_3', { 'groups': 'agency' });
// Route this sign_in event to Analytics IDs in the 'agency' group:
gtag('event', 'sign_in', { 'send_to': 'agency' });
কিভাবে গ্রুপ এবং রুট ডেটা সম্পর্কে আরও জানুন।
একটি ইভেন্ট পাঠানো হয়েছে যখন জানুন
কিছু ক্ষেত্রে, আপনাকে জানতে হবে কখন একটি ইভেন্ট সফলভাবে Google Analytics-এ পাঠানো হয়েছে, যাতে আপনি পরে অবিলম্বে ব্যবস্থা নিতে পারেন। এটি সাধারণ যখন আপনি একটি নির্দিষ্ট ইন্টারঅ্যাকশন রেকর্ড করতে চান যা একজন ব্যবহারকারীকে বর্তমান পৃষ্ঠা থেকে দূরে নিয়ে যাবে। পরবর্তী পৃষ্ঠা লোড হওয়া শুরু হওয়ার সাথে সাথে অনেক ব্রাউজার জাভাস্ক্রিপ্ট চালানো বন্ধ করে দেয়, যার মানে আপনার gtag.js event কমান্ডগুলি কখনই চলতে পারে না।
উদাহরণস্বরূপ, একজন ব্যবহারকারী ফর্মের জমা বোতামে ক্লিক করেছেন তা রেকর্ড করতে আপনি Google Analytics-এ একটি ইভেন্ট পাঠাতে চাইতে পারেন। বেশিরভাগ ক্ষেত্রে, সাবমিট বোতামে ক্লিক করলে পরবর্তী পৃষ্ঠাটি অবিলম্বে লোড হতে শুরু করবে কোনো event কমান্ড কার্যকর করার সুযোগ পাওয়ার আগে।
সমাধান হল পরবর্তী পৃষ্ঠাটি লোড হওয়া থেকে থামাতে ইভেন্টটিকে আটকানো যাতে আপনি ইভেন্টটি Google Analytics-এ পাঠাতে পারেন। ইভেন্ট পাঠানোর পরে, প্রোগ্রামে ফর্ম জমা দিন।
ইভেন্ট কলব্যাক ফাংশন বাস্তবায়ন
আপনি একটি ইভেন্ট কলব্যাক ফাংশন বাস্তবায়ন করতে পারেন যা একটি ইভেন্ট সফলভাবে পাঠানোর সাথে সাথে কল করা হয়।
নিম্নলিখিত উদাহরণটি দেখায় কিভাবে একটি ফর্মের ডিফল্ট জমা ক্রিয়া বাতিল করতে হয়, Google Analytics-এ একটি ইভেন্ট পাঠাতে হয় এবং তারপর ইভেন্ট কলব্যাক ফাংশন ব্যবহার করে ফর্মটি পুনরায় জমা দিতে হয়:
// Get a reference to the form element, assuming
// it contains the ID attribute "signup-form".
var form = document.getElementById('signup-form');
// Add a listener for the "submit" event.
form.addEventListener('submit', function(event) {
// Prevent the browser from submitting the form
// and thus unloading the current page.
event.preventDefault();
// Send the event to Google Analytics and
// resubmit the form once the hit is done.
gtag('event', 'signup_form_complete', {
'event_callback': function() {
form.submit();
}
});
});
টাইমআউট পরিচালনা করুন
উপরের উদাহরণে একটি ত্রুটি রয়েছে: gtag.js লাইব্রেরি লোড করতে ব্যর্থ হলে, ইভেন্ট কলব্যাক ফাংশন কখনই চলবে না এবং ব্যবহারকারীরা কখনই ফর্ম জমা দিতে পারবেন না।
যখনই আপনি ইভেন্ট কলব্যাক ফাংশনের মধ্যে সমালোচনামূলক সাইটের কার্যকারিতা রাখেন, gtag.js লাইব্রেরি লোড করতে ব্যর্থ হয় এমন ক্ষেত্রে আপনার সর্বদা একটি টাইমআউট ফাংশন ব্যবহার করা উচিত।
নিম্নলিখিত উদাহরণটি একটি টাইমআউট ব্যবহার করার জন্য উপরের কোডটিকে উন্নত করে। ব্যবহারকারী সাবমিট বোতামে ক্লিক করার পর যদি এক সেকেন্ড চলে যায় এবং ইভেন্ট কলব্যাক ফাংশনটি চালু না হয়, তবে ফর্মটি আবার জমা দেওয়া হবে।
// Gets a reference to the form element, assuming
// it contains the ID attribute "signup-form".
var form = document.getElementById('signup-form');
// Adds a listener for the "submit" event.
form.addEventListener('submit', function(event) {
// Prevents the browser from submitting the form
// and thus unloading the current page.
event.preventDefault();
// Creates a timeout to call submitForm after one second.
setTimeout(submitForm, 1000);
// Monitors whether or not the form has been submitted.
// This prevents the form from being submitted twice in cases
// where the event callback function fires normally.
var formSubmitted = false;
function submitForm() {
if (!formSubmitted) {
formSubmitted = true;
form.submit();
}
}
// Sends the event to Google Analytics and
// resubmits the form once the hit is done.
gtag('event', 'signup_form_complete', {
'event_callback': submitForm
});
});
আপনি যদি আপনার সাইটে উপরের প্যাটার্নটি ব্যবহার করেন, তাহলে টাইমআউট পরিচালনা করার জন্য একটি ইউটিলিটি ফাংশন তৈরি করুন।
নিম্নলিখিত ইউটিলিটি ফাংশন ইনপুট হিসাবে একটি ফাংশন গ্রহণ করে এবং একটি নতুন ফাংশন প্রদান করে। যদি প্রত্যাবর্তিত ফাংশনটি টাইমআউট সময়ের আগে কল করা হয় (ডিফল্ট টাইমআউট এক সেকেন্ড), এটি টাইমআউট সাফ করে এবং ইনপুট ফাংশনকে কল করে। যদি প্রত্যাবর্তিত ফাংশনটি সময়সীমার আগে কল করা না হয়, ইনপুট ফাংশন নির্বিশেষে বলা হয়।
function createFunctionWithTimeout(callback, opt_timeout) {
var called = false;
function fn() {
if (!called) {
called = true;
callback();
}
}
setTimeout(fn, opt_timeout || 1000);
return fn;
}
এখন, আপনি সমস্ত ইভেন্ট কলব্যাক ফাংশনগুলিকে একটি টাইমআউটের সাথে গুটিয়ে নিতে পারেন যাতে আপনার সাইটটি প্রত্যাশা অনুযায়ী কাজ করে, এমনকি এমন ক্ষেত্রেও যেখানে আপনার ইভেন্টগুলি পাঠাতে ব্যর্থ হয় বা gtag.js লাইব্রেরি কখনই লোড হয় না।
// Gets a reference to the form element, assuming
// it contains the ID attribute "signup-form".
var form = document.getElementById('signup-form');
// Adds a listener for the "submit" event.
form.addEventListener('submit', function(event) {
// Prevents the browser from submitting the form
// and thus unloading the current page.
event.preventDefault();
// Sends the event to Google Analytics and
// resubmits the form once the hit is done.
gtag('event', 'signup_form', { 'event_callback': {
createFunctionWithTimeout(function() {
form.submit();
})
}});
});
বিভিন্ন পরিবহন ব্যবস্থা নির্দিষ্ট করুন
ডিফল্টরূপে, gtag.js এইচটিটিপিএস পদ্ধতি এবং পরিবহন ব্যবস্থা বেছে নেয় যার সাহায্যে সর্বোত্তমভাবে হিট পাঠানো যায়। তিনটি বিকল্প হল:
- 'ছবি' (একটি
Imageবস্তু ব্যবহার করে) - 'xhr' (একটি
XMLHttpRequestঅবজেক্ট ব্যবহার করে) - 'বীকন' (
navigator.sendBeaconপদ্ধতি ব্যবহার করে)
প্রথম দুটি পদ্ধতি পূর্ববর্তী বিভাগে বর্ণিত সমস্যাটি ভাগ করে, যেখানে পৃষ্ঠাটি আনলোড করা হলে হিট পাঠানো হয় না। navigator.sendBeacon পদ্ধতি একটি হিট কলব্যাক সেট না করেই ওয়েব সার্ভারে অসিঙ্ক্রোনাসভাবে হিট প্রেরণ করে এই সমস্যার সমাধান করে৷
নিম্নলিখিত কোডটি এটি সমর্থন করে এমন ব্রাউজারগুলির জন্য পরিবহন ব্যবস্থাকে 'beacon' এ সেট করে:
gtag('config', 'GA_MEASUREMENT_ID', { 'transport_type': 'beacon'});