این آموزش به شما نشان میدهد که چگونه با استفاده از گوگل تگ منیجر، اندازهگیری گوگل آنالیتیکس را برای یک برنامه تک صفحهای (SPA) تنظیم کنید. شما یاد خواهید گرفت که چگونه ویژگی گوگل آنالیتیکس خود را پیکربندی کنید، متغیرهای لازم GTM را فعال کنید و تگهایی ایجاد کنید که با تغییرات تاریخچه فعال میشوند.
قبل از اینکه شروع کنی
این آموزش فرض میکند که شما موارد زیر را دارید:
- یک حساب و دارایی گوگل آنالیتیکس .
- یک کانتینر گوگل تگ منیجر که روی SPA شما نصب شده باشد.
- نقش ویرایشگر (یا بالاتر) برای هر دو سرویس گوگل آنالیتیکس و گوگل تگ منیجر.
مرحله 1: آمادهسازی جریان داده GA4
برای ردیابی دستی رویدادهای page_view در یک SPA، ابتدا باید نمایش خودکار صفحات مبتنی بر تاریخچه را در GA4 غیرفعال کنید تا از شمارش مجدد جلوگیری شود.
- گوگل آنالیتیکس را باز کنید.
- در بخش مدیریت ، در قسمت جمعآوری و اصلاح دادهها ، روی جریانهای داده کلیک کنید.
- جریان داده وب خود را انتخاب کنید.
- در بخش اندازهگیری پیشرفته ، روی نماد تنظیمات کلیک کنید
. - در قسمت بازدیدهای صفحه > نمایش تنظیمات پیشرفته ، تغییرات صفحه بر اساس رویدادهای تاریخچه مرورگر را پاک کنید.
- روی ذخیره کلیک کنید.
مرحله ۲: متغیرهای تاریخچه داخلی را در تگ منیجر فعال کنید
برای استفاده از تریگرها یا متغیرهای مبتنی بر تاریخچه در GTM، ابتدا باید متغیرهای تاریخچه داخلی را فعال کنید.
- گوگل تگ منیجر را باز کنید.
- در فضای کاری خود، به بخش متغیرها (Variables) بروید.
- در زیر متغیرهای داخلی ، روی پیکربندی کلیک کنید.
- در بخش تاریخچه ، متغیرهای زیر را فعال کنید:
-
History New URL Fragment -
History Old URL Fragment -
History New State -
History Old State -
History Source
-
- پنل تنظیمات را ببندید.
مرحله ۳: ایجاد تریگر تغییر تاریخچه
در مرحله بعد، یک تریگر ایجاد کنید که هر زمان که یک رویداد تغییر تاریخچه (مانند pushState یا replaceState ) در SPA شما رخ میدهد، فعال شود.
- در فضای کاری Tag Manager خود، به منوی Triggers بروید.
- روی جدید کلیک کنید.
- در پیکربندی تریگر ، تریگر تغییر تاریخچه (History Change) را انتخاب کنید.
- (اختیاری) اگر فقط میخواهید تغییرات خاصی از صفحه را ردیابی کنید، تریگر را طوری بهروزرسانی کنید که روی «برخی از تغییرات تاریخچه» فعال شود.
- نام تریگر را وارد کنید (مثلاً «تغییر تاریخچه») و روی ذخیره کلیک کنید.
مرحله ۴: ایجاد تگ گوگل
حالا، یک تگ گوگل ایجاد کنید که پارامتر page_location را هر زمان که تغییری در تاریخچه رخ میدهد، بهروزرسانی کند.
- در منوی برچسبها ، روی «جدید» کلیک کنید.
- در پیکربندی برچسب ، برچسب گوگل را انتخاب کنید.
- شناسه برچسب خود را وارد کنید (همان شناسهای که برای برچسب اولیه گوگل خود استفاده کردهاید).
در تنظیمات پیکربندی ، پارامترهای زیر را اضافه کنید:
-
page_location:{{Page URL}} -
page_title:{{Page Title}} -
update:true
-
برچسب را نامگذاری کنید (برای مثال، "برچسب گوگل - بهروزرسانی SPA") و روی ذخیره کلیک کنید.
مرحله ۵: ارسال رویداد مجازی page_view
در نهایت، یک تگ رویداد GA4 ایجاد کنید تا رویداد page_view واقعی را برای هر بار بارگذاری صفحه مجازی ارسال کند.
- در منوی برچسبها ، روی «جدید» کلیک کنید.
- در پیکربندی برچسب ، Google Analytics: GA4 Event را انتخاب کنید.
- شناسه اندازهگیری خود را وارد کنید.
- نام رویداد را روی
page_viewتنظیم کنید. - در تنظیمات پیشرفته > توالی تگها ، گزینهی «قبل از فعال شدن رویداد GA4 - نمای صفحه مجازی، یک تگ ایجاد کنید» را انتخاب کنید و تگ Google Tag - SPA Update را که در مرحله ۴ ایجاد کردهاید، انتخاب کنید.
- در قسمت Triggering ، تریگر History Change که در مرحله ۳ ایجاد کردید را انتخاب کنید.
- برچسب را نامگذاری کنید (برای مثال، "رویداد GA4 - نمای صفحه مجازی") و روی ذخیره کلیک کنید.
مرحله ۶: تنظیمات خود را تأیید کنید
برای اطمینان از اینکه بازدیدهای صفحه مجازی شما به درستی ثبت میشوند:
- در تگ منیجر، برای ورود به حالت پیشنمایش، روی پیشنمایش کلیک کنید.
- از طریق SPA خود حرکت کنید.
- در DebugView گوگل آنالیتیکس ، تأیید کنید که برای هر تغییر صفحه، یک رویداد
page_viewجدید ظاهر میشود. - بررسی کنید که مقادیر
page_locationبا انتظارات شما مطابقت داشته باشند.