Google Tag Manager کا کسٹم پکسل بنائیں

آپ اپنے تھرڈ پارٹی پکسل کو منظم کرنے کے لیے Google Tag Manager (GTM) کو بطور کسٹم پکسل استعمال کر سکتے ہیں۔

جب آپ اپنا GTM کسٹم پکسل ٹیسٹ کرنے کے لیے تیار ہوں، تو Shopify Pixel Helper استعمال کریں تاکہ یہ یقینی بنایا جا سکے کہ جن ایونٹ کو آپ ٹریک کرنا چاہتے ہیں وہ بغیر کسی خرابی کے سینڈ باکس میں شامل کیے جا رہے ہیں۔

آپ یہ ٹیسٹ کرنے کے لیے Google Tag Assistant پیج ایکسٹینشن بھی استعمال کر سکتے ہیں کہ پیج پر کون سے Google ٹیگ لوڈ ہو رہے ہیں۔ تاہم، Google Tag Assistant کا Troubleshoot tag فیچر کسٹم پکسل کے ساتھ مطابقت نہیں رکھتا، اور یہ کسٹم پکسل میں موجود کسی Google ٹیگ یا GTM کے ذریعے لوڈ ہونے والے دیگر پکسل کا پتہ نہیں لگاتا ہے۔

اس پیج پر

کسٹم پکسل بنانے کی تیاری

Google Tag Manager استعمال کر کے کسٹم پکسل بنانے سے پہلے، درج ذیل معلومات کا جائزہ لیں تاکہ یہ یقینی بنایا جا سکے کہ آپ اپنا پکسل کنفیگر کرنے کا طریقہ سمجھتے ہیں:

Google Tag Manager اکاؤنٹ بنائیں یا کھولیں اور GTM کنٹینر ID حاصل کریں۔
سیکیورٹی کی غرض سے، ہمارے سینڈ باکس میں لوڈ کیے گئے ٹیگ مینیجر پر بالکل ویسی ہی پابندیاں عائد ہوتی ہیں جیسی کسی دوسرے پکسل پر ہوتی ہیں۔ پکسل سینڈ باکس کی پابندیوں کے بارے میں مزید جانیں۔

Google Tag Manager کا کسٹم پکسل بنائیں

آپ اپنے تھرڈ پارٹی پکسل کو منظم کرنے کے لیے Google Tag Manager کا کسٹم پکسل بنا سکتے ہیں۔

اقدامات:

اپنا Google Tag Manager اکاؤنٹ کھولیں، اور وہ اکاؤنٹ منتخب کریں جس کے ساتھ آپ کسٹم پکسل سیٹ اپ کرنا چاہتے ہیں۔
انسٹالیشن کوڈ کھولنے کے لیے Admin پر کلک کریں، اور پھر Install Google Tag Manager پر کلک کریں۔
وہ کوڈ بلاک کاپی کریں جو کسی پیج کے head سیکشن سے تعلق رکھتا ہو۔
کوڈ بلاک سے HTML ٹیگ ہٹائیں۔ مثال کے طور پر، <script></script>۔
باقی کوڈ کو ایک نئے Shopify کسٹم پکسل میں داخل کریں۔
کسٹمر ایونٹ کو سبسکرائب کریں اور GTM کی dataLayer پر پش کریں۔
کوڈ کیسا نظر آنا چاہیے، اس کا جائزہ لینے کے لیے، Google Tag Manager کسٹم پکسل کی مثال دیکھیں۔
Google Tag Manager کو کنفیگر کریں تاکہ وہ آپ کے کسٹم پکسل سے ایونٹ قبول کرے۔
اختیاری: اگر آپ کی checkout.liquid فائل میں موجودہ dataLayer.push(event) کالز موجود ہیں، تو اسے analytics.publish() سے تبدیل کریں۔

کسٹمر ایونٹ کو سبسکرائب کریں اور GTM کی ڈیٹا لیئر پر پش کریں

آپ اپنے کسٹم پکسل کوڈ میں GTM dataLayer کا استعمال کر کے کسٹمر ایونٹ کو سبسکرائب کر سکتے ہیں۔

ڈیفالٹ کے طور پر، معیاری ایونٹ کا ایک سیٹ ہوتا ہے جسے آپ سبسکرائب کر سکتے ہیں۔ تاہم، اگر آپ ایسے کسٹمر ایونٹ کو ٹریک کرنا چاہتے ہیں جو معیاری ایونٹ کی پیشکش کا حصہ نہیں ہیں، تو آپ Liquid ٹیمپلیٹ فائلوں سے اپنے کسٹم ایونٹ شائع کر سکتے ہیں۔

ذیل میں معیاری ”product_viewed“ ایونٹ کو سبسکرائب کرنے کی ایک مثال دی گئی ہے، جو یہ ظاہر کرتا ہے کہ کب کوئی شخص پروڈکٹ دیکھتا ہے۔ جب ایونٹ ٹرگر ہوتا ہے، تو یہ ایونٹ کو dataLayer پر پش کر دیتا ہے۔

analytics.subscribe("product_viewed", (event) => {
  window.dataLayer.push({
    event: "product_viewed",
    product_title: event.data?.productVariant?.title,
  });
});

اس مثال میں، پروڈکٹ کا ٹائٹل ایونٹ پے لوڈ میں پاس کیا جا رہا ہے۔ آپ اپنی پسند کے ٹیگ میں ایونٹ پے لوڈ سے پروڈکٹ کا ٹائٹل کیپچر کرنے کے لیے Google Tag Manager ویری ایبل استعمال کر سکتے ہیں۔

Google Tag Manager کسٹم پکسل کی مثال

ذیل کی مثال Google Tag Manager کے کسٹم پکسل کا ایک سادہ ورژن ہے جو دکھاتا ہے کہ Google Tag Manager کو ڈیٹا کیسے بھیجنا ہے۔ اپنی dataLayer پر مزید ایونٹ پش کرنے کے لیے، آپ مزید معیاری اور کسٹم ایونٹ کو سبسکرائب کر سکتے ہیں۔

نوٹ

اس پکسل کی مثال میں Google Consent Mode v2 کے حوالے سے مثالی سیٹنگز بھی شامل ہیں، جو ایک ایسا موڈ ہے جس کی مدد سے پکسل، یورپی اقتصادی علاقہ (EEA) سمیت تمام ٹریفک کے لیے وزیٹر کے کوکی کنسنٹ کے انتخاب کا احترام کرتا ہے۔ آپ Google Ads Help سے کنسنٹ موڈ کے بارے میں مزید جان سکتے ہیں۔

ہو سکتا ہے کہ یہ مثالی سیٹنگز آپ کے علاقے کی پرائیویسی سے متعلق قانون سازی کی بنیاد پر آپ کے سٹور کی شرائط کے مطابق نہ ہوں۔ اگر آپ کو اپنے کسٹم پکسل میں کنسنٹ سیٹنگز شامل کرنے یا انہیں کسٹمائز کرنے میں مدد درکار ہے، تو Google کی ویب سائٹس پر کنسنٹ موڈ سیٹ اپ کریں گائیڈ کا جائزہ لیں یا کسی Shopify پارٹنر کی خدمات حاصل کریں۔

// Define dataLayer and the gtag function.
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}

//Initialize GTM tag
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer', 'GTM-XXXXXXX');

//Google Consent Mode v2
gtag('consent', 'update', {
  'ad_storage': 'granted',
  'analytics_storage': 'granted',
  'ad_user_data': 'granted',
  'ad_personalization': 'granted',
});

//subscribe to events
analytics.subscribe("checkout_completed", (event) => {
  window.dataLayer.push({
    event: "checkout_completed",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("payment_info_submitted", (event) => {
  window.dataLayer.push({
    event: "payment_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_shipping_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_shipping_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_address_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_address_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_contact_info_submitted", (event) => {
  window.dataLayer.push({
    event: "checkout_contact_info_submitted",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("checkout_started", (event) => {
  window.dataLayer.push({
    event: "checkout_started",
    timestamp: event.timestamp,
    id: event.id,
    token: event.data?.checkout?.token,
    url: event.context.document.location.href,
    client_id: event.clientId,
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    first_name: event.data?.checkout?.shippingAddress?.firstName,
    last_name: event.data?.checkout?.shippingAddress?.lastName,
    address1: event.data?.checkout?.shippingAddress?.address1,
    address2: event.data?.checkout?.shippingAddress?.address2,
    city: event.data?.checkout?.shippingAddress?.city,
    country: event.data?.checkout?.shippingAddress?.country,
    countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    province: event.data?.checkout?.shippingAddress?.province,
    provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
    zip: event.data?.checkout?.shippingAddress?.zip,
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    subtotal: event.data?.checkout?.subtotalPrice?.amount,
    shipping: event.data?.checkout?.shippingLine?.price?.amount,
    value: event.data?.checkout?.totalPrice?.amount,
    tax: event.data?.checkout?.totalTax?.amount,
  });
});

analytics.subscribe("product_added_to_cart", (event) => {
  window.dataLayer.push({
    event: "product_added_to_cart",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    price: event.data?.cartLine?.merchandise?.price?.amount,
    currency: event.data?.cartLine?.merchandise?.id,
    product_title: event.data?.cartLine?.merchandise?.product?.title,
    quantity: event.data?.cartLine?.quantity,
    total_cost: event.data?.cartLine?.cost?.totalAmount?.amount,
  });
});

analytics.subscribe("cart_viewed", (event) => {
  window.dataLayer.push({
    event: "cart_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    total_cost: event.data?.cart?.cost?.totalAmount?.amount,
    quantity: event.data?.cart?.totalQuantity,
    cart_id: event.data?.cart?.id,
  });
});

analytics.subscribe("page_viewed", (event) => {
  window.dataLayer.push({
    event: "page_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    page_title: event.context.document.title,
  });
});

analytics.subscribe("product_viewed", (event) => {
  window.dataLayer.push({
    event: "product_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    product_id: event.data?.productVariant?.product?.id,
    product_title: event.data?.productVariant?.title,
    product_sku: event.data?.productVariant?.sku,
  });
});

analytics.subscribe("search_submitted", (event) => {
  window.dataLayer.push({
    event: "search_submitted",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    query: event.data?.searchResult?.query,
  });
});

analytics.subscribe("collection_viewed", (event) => {
  window.dataLayer.push({
    event: "collection_viewed",
    timestamp: event.timestamp,
    id: event.id,
    client_id: event.clientId,
    url: event.context.document.location.href,
    collection_id: event.data?.collection?.id,
    collection_title: event.data?.collection?.title,
  });
});

اپنے کسٹم پکسل سے ایونٹس قبول کرنے کے لیے Google Tag Manager کنفیگر کریں

اپنا کسٹم پکسل بنانے کے بعد، آپ کو اپنے کسٹم پکسل سے ایونٹس قبول کرنے کے لیے Google Tag Manager کو کنفیگر کرنا ہوگا۔ ایسا کرنے کے لیے، آپ کو Google Tag Manager میں ایک ٹیگ، ایک ٹرگر، اور dataLayer متغیرات (variables) درکار ہوں گے۔

چند منتخب معیاری کسٹمر ایونٹس اور Google Tag Manager میں ان کے متبادلات کی کچھ مثالیں درج ذیل ٹیبل میں دی گئی ہیں:

پکسلز کے ساتھ استعمال ہونے والے معیاری Shopify کسٹمر ایونٹس کی فہرست، جن کا Google Tag Manager میں موجود ان کے مساوی کسٹمر ایونٹس کے ساتھ موازنہ کیا گیا ہے، اور ساتھ ہی ایونٹس کو چلانے (fire) کے لیے درکار ٹرگر بھی شامل ہے۔
Shopify ایونٹ	ٹرگر	GTM ایونٹ
payment_info_submitted	پیمنٹ کی معلومات سبمٹ کریں	add_payment_info
checkout_address_info_submitted	شپنگ کی معلومات سبمٹ کریں	add_shipping_info
product_added_to_cart	شاپنگ کارٹ میں کوئی آئٹم شامل کریں	add_to_cart
checkout_started	چیک آؤٹ شروع کریں	begin_checkout
checkout_completed	چیک آؤٹ مکمل کریں	purchase
product_removed_from_cart	کارٹ سے آئٹم ہٹائیں	remove_from_cart
cart_viewed	شاپنگ کارٹ دیکھیں	view_cart
product_viewed	پروڈکٹ کی تفصیلات کا صفحہ دیکھیں	view_item
collection_viewed	آئٹمز کی فہرست دیکھنا	view_item_list

آپ کے کسٹم پکسل dataLayer ایونٹس پر کارروائی ہونے کے لیے، ضروری ہے کہ GTM ٹیگ کے ایونٹ پیرامیٹرز متوقع نام رکھنے کے اصولوں (naming conventions) سے مماثل ہوں۔

منتخب شدہ کسٹم پکسل dataLayer ایونٹ کی پراپرٹیز اور ان کے مساوی Google Analytics 4 (GA4) ایونٹ کے پیرامیٹرز کی کچھ مثالیں درج ذیل ہیں:

GA4 نام رکھنے کا اصول استعمال کرنے والے کسٹم پکسل `dataLayer` ایونٹس کی فہرست
کسٹم پکسل `dataLayer` ایونٹس	GA4 ایونٹ کے پیرامیٹرز
`event.data?.checkout?.currencyCode`	`currency`
`event.data?.checkout?.totalPrice?.amount`	`value`
`event.data?.checkout?.order?.id`	`transaction_id`
`event.data?.checkout?.discountAllocations`	`coupon`
`event.data?.checkout?.shippingLine?.price?.amount`	`shipping`
`event.data?.checkout?.totalTax`	`tax`
`event.data?.checkout?.lineItems`	`items`

درج ذیل checkout_completed ایونٹ کا استعمال کرتے ہوئے ایک مثال یہ ہے:

analytics.subscribe("checkout_completed", (event) => {
  window.dataLayer.push({
    event: "checkout_completed",
    orderId: event.data?.checkout?.order?.id,
    currency: event.data?.checkout?.currencyCode,
    price: event.data.checkout.totalPrice.amount,
    shippingLine: event.data.checkout.shippingLine.price.amount,
    totalTax: event.data.checkout.totalTax,
  });
});

Google Tag Manager کا ٹرگر، کسٹم ایونٹ کی ایک قسم ہے جس کے ایونٹ کا نام checkout_completed ہے۔ ٹرگر میں موجود Event name کی فیلڈ کا آپ کے کسٹم پکسل میں موجود event کلید (key) سے مماثل ہونا ضروری ہے۔

orderId اور currency ایسے متغیرات (variables) ہیں جنہیں آپ ایونٹ سے ڈیٹا کیپچر کرنے کے لیے Google Tag Manager میں استعمال کرتے ہیں۔ انہیں Google Tag Manager میں موجود dataLayer متغیر پر میپ کیا جا سکتا ہے۔ ہر ایونٹ کے متغیر کو اپنا dataLayer متغیر درکار ہوتا ہے۔ تمام کسٹم ایونٹس پر فائر ہونے کے لیے ٹرگر سیٹ کریں۔

ایک ایسا ٹیگ بنائیں جو آپ کے ابھی بنائے گئے ٹرگر کا استعمال کرے۔ ایونٹ کے پیرامیٹرز کے تحت، وہ متغیرات شامل کریں جنہیں آپ کیپچر کرنا چاہتے ہیں۔ اوپر دی گئی مثال میں، orderId، currency، price، shippingLine اور totalTax کو بطور dataLayer متغیرات سیٹ اپ کیا جائے گا۔ ہر بار جب ٹیگ فائر ہوگا، تو یہ ایونٹ کے ساتھ ان dataLayer متغیرات کو کیپچر کرے گا۔

نوٹ کریں کہ ڈیٹا ٹرانسفر ہونے کے لیے Google Tag Manager میں کم از کم ایک ٹیگ اور ٹرگر سیٹ اپ ہونا ضروری ہے۔

پرانی dataLayer.push(event) کالز کو analytics.publish() سے تبدیل کرنا

اگر آپ نے پہلے Google Tag Manager سیٹ اپ کیا ہے، تو آپ کو اپنی dataLayer.push کالز کو Shopify.analytics.publish() کالز سے تبدیل کرنا ہوگا۔ آپ اپنے تھیم ایڈیٹر کے Layout سیکشن میں، اپنی theme.liquid فائلز کے اندر اپنی dataLayer.push کالز تلاش کر سکتے ہیں۔

آپ کو checkout.liquid میں بھی dataLayer.push کالز کو تبدیل کرنے کی ضرورت ہے۔ تاہم، چونکہ checkout.liquid، Shopify Extensions کے ساتھ سازگار نہیں ہے، اس لیے آپ کو ویب پکسلز پر ڈیٹا پش کرنے کے لیے ایک UI ایکسٹینشن کا استعمال کرنا ہوگا۔

ذیل میں theme.liquid فائلز میں dataLayer کا استعمال کر کے ٹریک کیے جانے والے کسٹم ای میل سائن اپ ایونٹ کی ایک سادہ مثال دی گئی ہے:

<script>
  dataLayer.push({ event: 'email_signup', email: customer.email });
</script>

Shopify کا متبادل اس طرح ظاہر ہوتا ہے، جو آپ کے کسٹم پکسل میں ڈیٹا پش کرتا ہے:

<script>
  Shopify.analytics.publish('email_signup', {email: customer.email });
</script>

پھر، آپ اپنے کسٹم پکسل کوڈ میں کچھ اس طرح کا اضافہ کریں گے:

analytics.subscribe("email_signup", (event) => {
  window.dataLayer.push({
   'event': 'email_signup',
   'email': event.customData.email,
  });
});

پرانا dataLayer.push(data) تبدیل کریں

Google Tag Manager میں ایک فیچر ہے جو آپ کو ہر ایونٹ پر ایک stateful dataLayer آبجیکٹ پش کرنے دیتا ہے۔ اگرچہ Shopify کے پکسل سینڈ باکس میں اس کے مساوی فیچر شامل نہیں ہے، لیکن آپ اپنا ڈیٹا آبجیکٹ بنا کر اور اسے کسٹم ایونٹ میں پاس کر کے وہی نتیجہ حاصل کر سکتے ہیں۔

مثال کے طور پر، اپنے کسی بھی کسٹم ایونٹ کے پبلش ہونے سے پہلے ایک ”customData“ آبجیکٹ کی وضاحت کریں:

<script>
  const customData = {email: customer.email}
</script>

پھر، جب بھی آپ اپنا کسٹم ڈیٹا شامل کرنا چاہیں، اسے اپنے پبلش طریقہ کار میں پاس کریں:

<script>
  Shopify.analytics.publish('email_signup', customData);
</script>

Google Analytics 4 سیٹ اپ کرنے کے لیے تجاویز

Google Tag Manager کو کسٹم پکسل کے طور پر استعمال کرتے وقت Google Analytics 4 (GA4) سیٹ اپ کرنے کے لیے درج ذیل تجاویز پر غور کریں۔

صاف پیج URL

جب GA4 کسی سینڈ باکس میں چل رہا ہوتا ہے، تو آپ نوٹ کر سکتے ہیں کہ پیج URL میں اس سینڈ باکس کے بارے میں معلومات شامل ہوتی ہیں جس میں یہ کام کر رہا ہے۔ اگر آپ ان URL سے سینڈ باکس کی معلومات کو ہٹانا چاہتے ہیں، تو آپ GA4 کی خودکار پیج ٹریکنگ کو آف کر سکتے ہیں، اور اس کے بجائے معیاری page_viewed ایونٹ کا استعمال کر کے اپنی خود کی ٹریکنگ لاگو کر سکتے ہیں۔

analytics.subscribe('page_viewed', (event) => {
  window.dataLayer.push({
   'event': 'page_viewed',
   'page_location': event.context.window.location.href,
   'page_title': event.context.document.title,
  });
});

اپنے ایونٹ کو dataLayer پر پبلش کرنے کے بعد، آپ ایک GA4 page_view ٹیگ بنا سکتے ہیں جو page_viewed ایونٹ پر ٹرگر ہوتا ہے۔ عام طور پر، آپ Google Analytics: GA4 Event ٹیگ کی قسم استعمال کر سکتے ہیں، اور ایونٹ کا نام page_view پر سیٹ کر سکتے ہیں۔ ٹیگ کی قسم اور ایونٹ کا نام سیٹ کرنے کے بعد، آپ کو page_location کے لیے ایک پیرامیٹر شامل کرنا چاہیے اور ویلیو کو اسی ویلیو پر سیٹ کرنا چاہیے جسے آپ نے اپنے کسٹم پکسل سے اپنے dataLayer میں پاس کیا ہے۔

Enhanced measurement

Shopify کے پکسل سینڈ باکس کے اندر GA4 لوڈ کرتے وقت، کچھ ایونٹ جن کا عام طور پر خودکار طور پر اندازہ لگایا جاتا ہے انہیں مینوئل طور پر سیٹ اپ کرنے کی ضرورت ہوگی۔ مثال کے طور پر، GA4 کی Enhanced measurement سیٹنگ کے حصے کے طور پر، کسٹم پکسل کا استعمال کرتے وقت سیکیورٹی وجوہات کی بنا پر آؤٹ باؤنڈ لنک کلکس کو خودکار طور پر ٹرگر نہیں کیا جا سکتا ہے۔ تاہم، کسٹم ایونٹ کے طور پر GA4 کے enhanced measurement ایونٹ کو خود لاگو کرنا ممکن ہے۔

نیچے دیے گئے کوڈ میں آؤٹ باؤنڈ لنک کلکس کو ٹریک کرنے کی ایک سادہ مثال شامل ہے:

<script>
  function detectOutboundLink() {
    // add your logic for determining if a link click is outbound

    // if the link click is outbound then publish it
    if (isOutboundLink) {
      Shopify.analytics.publish('outbound_link', { link_url: link_url });
    }
  }
</script>

آخر میں، GTM میں ایک GA4 ٹیگ بنائیں جو لنک کلک کو GA4 پر بھیجتا ہے، یہ یقینی بناتے ہوئے کہ GA4 کی enhanced ایونٹ نیمنگ سے مماثل ہونے کے لیے ایونٹ کا نام click ہے۔

آپ Google کی enhanced measurement کی کسی بھی میٹرک کے لیے یہی ٹریکنگ حاصل کر سکتے ہیں۔

Google Tag Manager کا کسٹم پکسل بنائیں

اس پیج پر

کسٹم پکسل بنانے کی تیاری

Google Tag Manager کا کسٹم پکسل بنائیں

اقدامات:

کسٹمر ایونٹ کو سبسکرائب کریں اور GTM کی ڈیٹا لیئر پر پش کریں

Google Tag Manager کسٹم پکسل کی مثال

اپنے کسٹم پکسل سے ایونٹس قبول کرنے کے لیے Google Tag Manager کنفیگر کریں

پرانی dataLayer.push(event) کالز کو analytics.publish() سے تبدیل کرنا

پرانا dataLayer.push(data) تبدیل کریں

Google Analytics 4 سیٹ اپ کرنے کے لیے تجاویز

صاف پیج URL

Enhanced measurement

اپنے کسٹم پکسل کی جانچ کریں اور ڈیبگ کریں