در گوگل تگ منیجر Google Tag Manager، مجموعه‌ی گسترده‌ای از متغیرها در اختیار شماست؛ از متغیرهای از پیش‌تعریف‌شده گرفته تا آن‌هایی که خودتان می‌سازید. متغیر Click Element؛ یکی از متغیرهای داخلی یا همان Built-in variableهایی که کمتر کسی درباره‌اش صحبت می‌کند. پس اگر اهل ردیابی رفتار کاربران در سایت هستید و می‌خواهید از GTM مثل یک پرفورمنس مارکتر حرفه ای استفاده کنید، پیشنهاد می‌کنم ادامه‌ی این مطلب را از دست ندهید.

متغیر Click Element در گوگل تگ منیجر چیست؟

یکی از متغیرهای داخلی (Built-in Variable) در گوگل تگ منیجر، متغیری است به نام Click Element. این متغیر، عنصری از صفحه را که کاربر روی آن کلیک کرده، به‌عنوان خروجی برمی‌گرداند. اما نکته مهم اینجاست که به‌صورت پیش‌فرض در همه کانتینرهای جدید GTM غیرفعال است.

برای فعال‌سازی آن باید وارد مسیر زیر شوید:

Variables > Configure
و سپس گزینه Click Element را تیک بزنید.

فعال‌سازی متغیر به‌تنهایی کافی نیست

اگر صرفاً این متغیر را فعال کنید، در حالت پیش‌نمایش و دیباگ (Preview and Debug Mode) گوگل تگ منیجر، هیچ داده‌ای به شما نشان داده نمی‌شود. چرا؟ چون برای اینکه این متغیر کار کند، باید حداقل یکی از تریگرهای زیر را هم فعال کرده باشید:

• All Elements Clicks
• Just Links

اگر با مفهوم ترکینگ کلیک در GTM آشنایی ندارید، پیشنهاد می‌کنم در دوره آموزش گوگل تگ منیجر شرکت کنید.

تفاوت Click Element با Click URL

در نگاه اول ممکن است در حالت پیش‌نمایش گوگل تگ منیجر، خروجی این متغیر با متغیر Click URL یکی به نظر برسد. اما این تصور اشتباه است.

متغیر Click Element، آبجکت کامل مربوط به عنصر کلیک‌شده را برمی‌گرداند. این یعنی:

• نه‌تنها لینک (URL) المان را برمی‌گرداند (اگر وجود داشته باشد)
• بلکه تمام ویژگی‌ها (Attributes) و داده‌های دیگر آن المان را هم در اختیار دارد

حتی اگر این اطلاعات برای یک کاربر معمولی قابل مشاهده نباشد، این متغیر آن‌ها را نگه می‌دارد.

نکته مهم درباره Preview Mode

در حالت پیش‌نمایش GTM، ممکن است متغیر Click Element به‌صورت یک رشته (String) نمایش داده شود. این نمایش گمراه‌کننده است. در واقع، زیرساخت اصلی این متغیر همچنان یک (Object) است، نه رشته.

پس اگر در حال تست تگ یا تریگر هستید و دیدید که مقدار این متغیر به صورت یک رشته ظاهر شده، نگران نباشید؛ کارکرد واقعی آن تغییر نکرده است.

متغیر «Click Element» شامل چه دیتایی است؟

دیتای این متیغر از لیسنرهای پیش‌فرض ایونت های خودکار در Google Tag Manager (GTM) تأمین می‌شوند. اگر حتی یکی از تریگرهای زیر را در تگ منیجر فعال کرده باشید:

• Just Links (کلیک روی لینک‌ها)
• All Element Clicks (کلیک روی تمام عناصر)
• Form Submission (ارسال فرم)
• Element Visibility (قابل مشاهده شدن یک عنصر)

به‌صورت خودکار، GTM در پس‌زمینه، لیسنر مرتبط با همان ایونت را فعال می‌کند و شروع به ترک کردن تعاملات کاربران با صفحه می‌کند.

این لیسنرها دقیقاً چه کاری می‌کنند؟

• Just Links کلیک روی لینک‌ها را ردیابی می‌کند.
• All Element Clicks تمام کلیک‌های روی المان های مختلف صفحه (به‌جز عناصر داخل iFrame) را ردیابی می‌کند.
• Form Submission تکمیل فرم را می‌کند.
• Element Visibility بررسی می‌کند که چه زمانی یک المان خاص در صفحه نمایان می‌شود.

ارسال داده به Data Layer

وقتی این لیسنرها (Listeners) یک تعامل را شناسایی می‌کنند، یک سری داده به Data Layer ارسال می‌شود. این داده‌ها به المانی که کاربر با آن تعامل داشته مربوط هستند.

داده‌هایی که به dataLayer.push ارسال می‌شوند، معمولاً شامل کلیدهای زیر هستند:

• gtm.element
• gtm.elementClasses
• gtm.elementTarget
• gtm.elementUrl
• gtm.elementId

برای مشاهده این مقادیر، کافی‌ست وارد بخش Preview و Debug در GTM شوید و به تب Data Layer سر بزنید.

این کلیدها چه کاربردی دارند؟

تمام این کلیدها به عنوان متغیرهای داخلی (Built-in Variables) در GTM قابل استفاده هستند، مانند:

• Click Element
• Click Classes
• Click Target
• Click URL
• Click ID

به جز gtm.element که یک (Object) است و اطلاعات بیشتری در دل خودش دارد، بقیه کلیدها صرفاً رشته متنی (String) هستند.

متغیر Click Element تنها گزینه موجود نیست!

اگر قبلاً با Google Tag Manager (یا به اختصار GTM) کار کرده باشید، احتمالاً می‌دانید که متغیر Click Element وظیفه‌اش این است که مقدار ذخیره‌شده در Data Layer را از کلید gtm.element دریافت کند. حالا اگر چنین کلیدی اصلاً در Data Layer وجود نداشته باشد، نتیجه‌ای که این متغیر برمی‌گرداند چیزی نیست جز undefined.

اما فقط Click Element نیست که از این کلید استفاده می‌کند!

چیزی که احتمالاً بسیاری از کاربران تازه‌کار GTM از آن بی‌خبرند این است که یک متغیر داخلی دیگر هم وجود دارد که دقیقاً به همین کلید در Data Layer دسترسی دارد، به نام Form Element.

در واقع، هم Click Element و هم Form Element، هر دو به کلید gtm.element دسترسی دارند — یا اگر دقیق‌تر بگوییم، به کلیدی در Data Model دسترسی پیدا می‌کنند که با همین نام شناخته می‌شود.

جفت‌ متغیرهای Form و Click دقیقاً یکسان هستند

جالب است بدانید تمامی متغیرهایی که برای ایونت های کلیک (Click) و فرم (Form) تعریف شده‌اند، به کلیدهای یکسانی دسترسی دارند. به جدول زیر توجه کنید:

• gtm.elementTarget توسط Click Target و Form Target
• gtm.elementUrl توسط Click URL و Form URL
• gtm.elementClasses توسط Click Classes و Form Classes
• gtm.elementId توسط Click ID و Form ID
• و در نهایت gtm.element توسط Click Element و Form Element

ایجاد متغیر دلخواه برای دسترسی به مقادیر مشترک در Data Layer

در کنار استفاده از متغیرهای پیش‌فرضی مانند Click Element یا Form Element، شما می‌توانید متغیرهای دلخواه خودتان را هم تعریف کنید تا به همان مقادیر دسترسی پیدا کنید.

فرض کنید می‌خواهید نسخه اختصاصی خودتان از متغیر Click Element را بسازید. برای این کار، کافی است به مسیر زیر در Google Tag Manager بروید:

Variables > New > Data Layer Variable

در قسمت Data Layer Variable Name، مقدار gtm.element را وارد کنید. این همان کلیدی است که داده‌ها در Data Layer در آن ذخیره می‌شوند.

نکته جالب اینجاست که متغیرهای Click Element و Form Element نیز دقیقاً از همین کلید استفاده می‌کنند. یعنی هر سه متغیر، به یک داده مشترک دسترسی دارند و نتیجه نهایی یکسانی را ارائه می‌دهند.

حالا شاید این سؤال پیش بیاید: “پس چرا باید خودمان یک متغیر جدید تعریف کنیم وقتی می‌توانیم از متغیرهای آماده استفاده کنیم؟” پاسخ مشخصی برایش وجود ندارد—هدف این بخش بیشتر این است که به شما نشان دهد ساختار GTM چطور کار می‌کند و چطور اجزا به هم متصل‌اند.

در این مطلب، قصد دارم نحوه ترکینگ فرم‌های AJAX با استفاده از گوگل تگ منیجر، موضوع اصلی این آموزش است. این آموزش بخشی از یک راهنمای جامع‌تر درباره ردیابی انواع فرم‌ها در Google Tag Manager است.

ساخت تگ HTML سفارشی با Listener مخصوص AJAX در GTM

اگر در حال خواندن این مطلب هستید، احتمالاً فرمی روی سایتتان دارید که توسط تریگر پیش‌فرض «ارسال فرم» (Form Submission) در گوگل تگ منیجر پشتیبانی نمی‌شود. این فرم معمولاً به جای اینکه کاربر را به صفحه «تشکر» هدایت کند، فقط پیام موفقیت‌آمیز بودن ارسال را نشان می‌دهد، بدون آنکه صفحه واقعاً رفرش شود.

در اینجا به احتمال زیاد فرم شما از تکنولوژی AJAX استفاده می‌کند. نیازی نیست درگیر جزئیات فنی آن شوید؛ چیزی که باید بدانید این است که راهی برای شنود (Listener) رویدادهای AJAX وجود دارد.

معرفی Listener پیشنهادی برای رویدادهای AJAX

شرکت Bounteous یک Listener آماده و رایگان برای گوگل تگ منیجر معرفی کرده که می‌توانید به راحتی از آن استفاده کنید. ما در این آموزش، کد پیشنهادی آن‌ها را برای رهگیری ارسال فرم‌های AJAX قرض خواهیم گرفت.

با وجود اینکه این کد مدت‌ها پیش نوشته شده (حتی در آن به اینترنت اکسپلورر ۹ اشاره شده)، اما همچنان به خوبی کار می‌کند.

نحوه استفاده از کد AJAX Listener در GTM

برای پیاده‌سازی این Listener کافی است کد زیر را در یک تگ HTML سفارشی (Custom HTML Tag) در Google Tag Manager قرار دهید:

<script id="gtm-jq-ajax-listen" type="text/javascript">
(function() {
 'use strict';
 var $;
 var n = 0;
 init();

 function init(n) {
   if (typeof jQuery !== 'undefined') {
     $ = jQuery;
     bindToAjax();
   } else if (n < 20) {
     n++;
     setTimeout(init, 500);
   }
 }

 function bindToAjax() {
   $(document).bind('ajaxComplete', function(evt, jqXhr, opts) {
     var fullUrl = document.createElement('a');
     fullUrl.href = opts.url;
     var pathname = fullUrl.pathname[0] === '/' ? fullUrl.pathname : '/' + fullUrl.pathname;
     var queryString = fullUrl.search[0] === '?' ? fullUrl.search.slice(1) : fullUrl.search;
     var queryParameters = objMap(queryString, '&', '=', true);
     var headers = objMap(jqXhr.getAllResponseHeaders(), '\n', ':');

     dataLayer.push({
       'event': 'ajaxComplete',
       'attributes': {
         'type': opts.type || '',
         'url': fullUrl.href || '',
         'queryParameters': queryParameters,
         'pathname': pathname || '',
         'hostname': fullUrl.hostname || '',
         'protocol': fullUrl.protocol || '',
         'fragment': fullUrl.hash || '',
         'statusCode': jqXhr.status || '',
         'statusText': jqXhr.statusText || '',
         'headers': headers,
         'timestamp': evt.timeStamp || '',
         'contentType': opts.contentType || '',
         'response': (jqXhr.responseJSON || jqXhr.responseXML || jqXhr.responseText || '')
       }
     });
   });
 }

 function objMap(data, delim, spl, decode) {
   var obj = {};
   if (!data || !delim || !spl) {
     return {};
   }
   var arr = data.split(delim);
   var i;
   if (arr) {
     for (i = 0; i < arr.length; i++) {
       var item = decode ? decodeURIComponent(arr[i]) : arr[i];
       var pair = item.split(spl);
       var key = trim_(pair[0]);
       var value = trim_(pair[1]);
       if (key && value) {
         obj[key] = value;
       }
     }
   }
   return obj;
 }

 function trim_(str) {
   if (str) {
     return str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
   }
 }
})();
</script>

بررسی استفاده از فرم‌های مبتنی بر AJAX

حالا وقت آن است که بررسی کنیم آیا فرم سایت شما بر پایه AJAX ساخته شده یا خیر:

1. حالت پیش‌نمایش و اشکال‌زدایی (Preview and Debug Mode) را فعال یا به‌روزرسانی کنید.
2. سعی کنید فرم موجود در وب‌سایتتان را ارسال کنید (بدون ایجاد خطا).
3. در کنسول پیش‌نمایش و اشکال‌زدایی، بررسی کنید که آیا رویداد ajaxComplete ظاهر شده یا خیر.

• اگر رویداد ajaxComplete را مشاهده کردید، فرم شما از فناوری AJAX استفاده می‌کند.
• اگر چنین رویدادی وجود نداشت، پیشنهاد می‌کنم این مطلب آموزشی درباره فرم‌های غیر AJAX را مطالعه کنید.

کار با فرم‌های AJAX

اگر پاسخ شما به سؤال قبلی مثبت است و فرم شما بر پایه AJAX ساخته شده، گام بعدی این است که ببینیم چگونه می‌توانیم از این ویژگی بهره ببریم:

• در حالت پیش‌نمایش و اشکال‌زدایی، روی رویداد ajaxComplete کلیک کنید و جزئیات API Call را باز کنید.

ممکن است این بخش در نگاه اول برای کسانی که توسعه‌دهنده حرفه‌ای نیستند، کمی پیچیده به نظر برسد؛ اما در عمل بسیار ساده‌تر از چیزی است که فکر می‌کنید.

شناسایی ارسال موفق فرم

پس از ارسال موفق فرم، داده‌هایی به Data Layer سایت منتقل می‌شود. هر خط از این اطلاعات، به‌صورت جداگانه، می‌تواند به‌عنوان یک متغیر Data Layer در Google Tag Manager مورد استفاده قرار گیرد.

حالا باید به دنبال عبارتی باشید که نشان‌دهنده ارسال موفق فرم باشد. کمی پایین‌تر اسکرول کنید و به دنبال بخش “response” بگردید.

اگر دقت کنید، پیامی شبیه به این مشاهده می‌کنید:
“با تشکر از تماس شما! به زودی با شما تماس خواهیم گرفت.”

تبریک می‌گویم! دقیقاً همین پیام را می‌توانید به‌عنوان یک تریگر (Trigger) برای رهگیری موفقیت‌آمیز ارسال فرم در GTM استفاده کنید.

متغیر Data Layer و ایجاد تریگر برای رویداد سفارشی در Google Tag Manager

ایجاد متغیر Data Layer

ابتدا باید یک متغیر Data Layer در Google Tag Manager بسازیم. برای این کار مراحل زیر را دنبال کنید:

• وارد بخش Variables شوید.
• به پایین صفحه اسکرول کنید تا به بخش User-Defined Variables برسید و روی گزینه New کلیک کنید.
• در بخش Variable Configuration، نوع متغیر را Data Layer Variable انتخاب کنید.
• در قسمت Data Layer Variable Name، این مقدار را وارد کنید:
  attributes.response.data.message

شاید برایتان سوال باشد که چرا به جای واژه ساده‌تر مثل response، از مسیر کامل attributes.response.data.message استفاده کردیم. اجازه بدهید دقیق‌تر این موضوع را بررسی کنیم.

بررسی ساختار داده در حالت Preview و Debug

در حالت Preview و Debug در GTM، اگر به خط دوم نگاه کنید، رویدادی با نام ajaxComplete مشاهده خواهید کرد؛ این همان رویدادی است که در سمت چپ کنسول نیز نمایش داده می‌شود. در این رویداد:

• ابتدا آبجکتی به نام attributes داریم که شامل داده‌های مختلف (به صورت کلید-مقدار) است.
• یکی از کلیدهای این آبجکت، response است.
• درون response، یک شیء دیگر به نام data داریم.
• و در نهایت، message در دل data قرار دارد.

می‌توانید این روند را مانند دسترسی به پوشه‌های تو در تو تصور کنید:
ابتدا وارد attributes می‌شوید، سپس response، بعد data و در نهایت message.

🔵 نکته مهم:
ساختار داده در پروژه‌های مختلف می‌تواند متفاوت باشد. ممکن است نام پارامترها تغییر کند. همیشه مسیر از attributes.response شروع می‌شود، اما ادامه آن ممکن است در فرم‌های مختلف فرق کند؛ مثلاً ممکن است به جای attributes.response.data.message، مسیر attributes.response.message باشد. بنابراین باید ساختار داده‌های خود را به دقت بررسی کنید و مسیر مناسب را انتخاب نمایید.

یک مثال دیگر:

فرض کنید می‌خواهید اطلاعات سرور (Server Data) را از پاسخ AJAX استخراج کنید. در این حالت باید نام متغیر Data Layer را اینگونه تعریف کنید:
attributes.headers.Server

دیباگ کردن متغیر ساخته شده

پس از ساخت متغیر Data Layer، حالا نوبت به تست آن می‌رسد:

• حالت Preview and Debug را در GTM رفرش کنید (روی دکمه Preview کلیک کنید).
• فرم موردنظر را پر کرده و ارسال کنید.
• روی آخرین رویداد ajaxComplete کلیک کنید.
• به تب Variables بروید و متغیر جدید با نام dlv – attributes.response.data.message را پیدا کنید.

اگر همه چیز را درست انجام داده باشید، این متغیر باید مقدار پیغام موفقیت‌آمیز ارسال فرم را نشان دهد.

⚠️ اگر مقدار این متغیر undefined بود، باید دنبال خطا بگردید. رایج‌ترین مشکلات شامل تایپ اشتباه نام متغیر یا تعریف نادرست مسیر داده‌هاست. برخی افراد به اشتباه فقط response را به جای attributes.response.data.message استفاده می‌کنند که باعث عدم دریافت داده می‌شود.

ساخت تریگر برای رویداد سفارشی

حالا بیایید تریگری بسازیم که فقط زمانی فعال شود که:

• رویداد ajaxComplete اتفاق بیفتد.
• و متغیر Data Layer حاوی عبارت “Thanks for contacting us” باشد.

مراحل ساخت تریگر:

• وارد بخش Triggers شوید و روی New کلیک کنید.
• نوع تریگر را Custom Event انتخاب کنید.
• در قسمت Event Name، مقدار ajaxComplete را وارد کنید.
• مشخص کنید که این تریگر برای Some Custom Events فعال شود.
• شرط زیر را تعریف کنید:
  متغیر dlv – attributes.response.data.message شامل “Thanks for contacting us” باشد.

تست نهایی

• این تریگر جدید را به تگ Google Analytics 4 Event که قبلاً ساخته‌اید، متصل کنید.
• مجدداً حالت Preview and Debug را باز یا رفرش کنید.
• فرم AJAX را پر کرده و ارسال کنید.
• پس از ارسال موفقیت‌آمیز، باید تگ GA4 شما فعال شود (این مورد در حالت Preview and Debug قابل مشاهده خواهد بود).
• همچنین می‌توانید در Google Analytics 4 Debug View این رویداد را بررسی کنید.

نکات مهم هنگام ردیابی فرم‌های AJAX

• پاسخ فرم شما ممکن است ساختار متفاوتی داشته باشد. بنابراین، باید متناسب با آن متغیر Data Layer و تریگر خود را تنظیم کنید.
• اگر توسعه‌دهندگان تغییراتی در ساختار پاسخ ایجاد کنند، تریگر شما ممکن است از کار بیفتد. بنابراین، حتماً تیم فنی را در جریان پیاده‌سازی‌های GTM قرار دهید.
• اگر صفحه شما چندین فرم AJAX داشته باشد، سعی کنید اطلاعات بیشتری از Data Layer استخراج کنید تا بتوانید فرم‌های مختلف را از هم تفکیک کنید.

در گوگل تگ منیجر (GTM)، تریگرهای نمایش صفحه (Page View) این امکان را فراهم می‌کنند که تگ‌ها (Tags) هنگام بارگذاری صفحات وب، فعال شوند. پنج نوع تریگر مرتبط با رویداد بارگذاری صفحه وجود دارد که هرکدام بر اساس زمان و شرایط متفاوتی فعال می‌شوند. ترتیب اولویت این تریگرها به شرح زیر است:

1. Consent Initialization (راه‌اندازی اولیه برای مدیریت رضایت کاربران)

این نوع تریگر برای اطمینان از اعمال تنظیمات مربوط به رضایت کاربران طراحی شده است—پیش از آن‌که تریگرهای دیگر فعال شوند. معمولاً از این تریگر برای برچسب‌هایی استفاده می‌شود که وضعیت رضایت کاربران را تنظیم یا به‌روزرسانی می‌کنند؛ مثلاً:

• تگ‌های مربوط به پلتفرم‌های مدیریت رضایت (CMP)
• تگ‌هایی که پیش‌فرض‌های رضایت را تعیین می‌کنند

در هر کانتینر (Container) در GTM، به صورت پیش‌فرض یک تریگر با عنوان Consent Initialization – All Pages وجود دارد. توجه داشته باشید که اگر نیاز دارید تگی خیلی زود در سایت اجرا شود، این تریگر گزینه‌ی مناسبی نیست. در این‌گونه موارد، باید از تریگر Initialization استفاده کنید.

2. Initialization (راه‌اندازی اولیه)

این تریگر طوری طراحی شده که قبل از همه‌ی تریگرها اجرا شود—به‌جز تریگر Consent Initialization. در هر کانتینر GTM به صورت پیش‌فرض یک تریگر Initialization – All Pages وجود دارد. این گزینه برای تگ‌هایی مناسب است که باید پیش از سایر تگ‌ها اجرا شوند.

3. Page View (نمایش صفحه)

این تریگر به محض شروع بارگذاری صفحه در مرورگر فعال می‌شود. اگر فقط نیاز به جمع‌آوری داده‌هایی دارید که بر اساس بازدید صفحات شکل می‌گیرند، این نوع تریگر گزینه‌ی مناسبی‌ست.

4. DOM Ready (آماده بودن ساختار HTML)

وقتی مرورگر بارگذاری کامل HTML صفحه را به پایان می‌رساند و مدل شیء سند (DOM) برای پردازش آماده می‌شود، این تریگر فعال می‌شود. اگر تگ‌های شما برای استخراج اطلاعات یا پر کردن متغیرها نیاز به دسترسی به ساختار DOM دارند، حتماً از این تریگر استفاده کنید تا از دسترسی کامل به عناصر HTML مطمئن شوید.

5. Window Loaded (پایان کامل بارگذاری صفحه)

این تریگر زمانی فعال می‌شود که صفحه به طور کامل—شامل تمام منابع مانند تصاویر، اسکریپت‌ها و فایل‌های خارجی—بارگذاری شده باشد. معمولاً در پروژه‌هایی که نیاز به اطمینان از بارگذاری کامل صفحه دارند، از این تریگر استفاده می‌شود.

کدام نوع تریگر (Trigger) را انتخاب کنیم؟

در زمان راه‌اندازی تگ‌ها در Google Tag Manager، انتخاب نوع مناسب «تریگر» اهمیت زیادی دارد. هر تریگر (یا محرک) بسته به هدفی که دارید باید به‌درستی انتخاب شود. در ادامه با رایج‌ترین تریگرها و موارد استفاده‌ی آن‌ها آشنا می‌شویم:

اگر تگ مربوط به دریافت رضایت کاربر است:

در صورتی‌ که تگی که می‌خواهید اجرا کنید به رضایت‌گیری از کاربر مرتبط باشد—مثلاً برای نمایش پنجره‌ی پاپ‌آپ رضایت (Consent Popup) یا تعیین وضعیت رضایت—از تریگر Consent Initialization استفاده کنید. این تریگر زودتر از هر تریگر دیگری فعال می‌شود و مناسب سناریوهایی است که باید قبل از هر چیز، وضعیت رضایت مشخص شود.

اگر می‌خواهید یک تگ بلافاصله پس از شروع بارگذاری صفحه اجرا شود:

در شرایطی که نیاز دارید یک تگ در سریع‌ترین زمان ممکن اجرا شود و وابستگی به هیچ‌یک از عناصر یا محتوای صفحه ندارد، از تریگر Initialization استفاده کنید. این نوع تریگر قبل از بارگذاری محتوا اجرا می‌شود و برای کارهای زیرساختی یا آماده‌سازی اسکریپت‌های خاص بسیار مناسب است.

اگر می‌خواهید تگی هم‌زمان با شروع بارگذاری صفحه اجرا شود:

تریگر Pageview زمانی فعال می‌شود که مرورگر شروع به بارگذاری صفحه می‌کند. اگر تگ شما نیازی به دسترسی به عناصر داخلی صفحه ندارد و تنها به لود شدن ابتدایی صفحه متکی است، این تریگر گزینه‌ی مناسبی است.

اگر اجرای تگ شما نیاز به مقدار خاصی از یک عنصر در صفحه دارد:

در شرایطی که تگ باید به محتوای یک عنصر خاص در صفحه (مثل یک متن، دکمه یا فرم) دسترسی داشته باشد، بهتر است از تریگر DOM Ready یا Window Loaded استفاده کنید. این تریگرها بعد از بارگذاری بخش‌های مختلف صفحه فعال می‌شوند و تضمین می‌کنند که اطلاعات مورد نظر در دسترس هستند.

اگر می‌خواهید تگ تنها بعد از بارگذاری کامل صفحه اجرا شود:

برای اطمینان از این‌که کل صفحه (از جمله تمام تصاویر و اسکریپت‌ها) بارگذاری شده است، از تریگر Window Loaded استفاده کنید. این گزینه به‌ویژه برای تگ‌هایی مفید است که نیاز به یک تجربه‌ی کاربری کامل دارند یا باید در هماهنگی کامل با محتوای نهایی صفحه اجرا شوند.

نحوه ایجاد یک Page View Trigger جدید

برای ساخت یک تریگر جدید در GTM مراحل زیر را طی کنید:

1. از منوی سمت چپ، روی Triggers کلیک کرده و سپس New را انتخاب کنید.
2. روی Trigger Configuration کلیک کنید و یکی از انواع تریگر Page View را انتخاب نمایید.
3. (اختیاری، اما توصیه‌شده برای بهبود عملکرد) شرایطی را برای محدودسازی فعال‌سازی تریگر مشخص کنید. مثلاً بر اساس آدرس صفحات (URL Pattern):
   • در بخش This trigger fires on گزینه‌ی Some Events را انتخاب کنید.
   • در قسمت Fire this trigger when an Event occurs and all of these conditions are true فیلتری تعریف کنید. مثال: Click URL contains /path/to/promo
4. تریگر را ذخیره کرده و تغییرات را منتشر (Publish) کنید.