برای ورود به دنیای نامحدود داده‌ها در دوره آموزشی بیگ کوئری کلیک کنید

Twitter Linkedin Youtube Instagram Telegram
Search
Close this search box.
Twitter Linkedin Youtube Instagram Telegram
  • No Comments

تفاوت لوکال استوریج با سشن استوریج و کوکی چیست؟

تفاوت لوکال استوریج با سشن استوریج و کوکی چیست؟
راهنمای مطالعه:
1 بررسی مختصری از تاریخچه کوکی
2 نیاز به افزایش ظرفیت ذخیره‌سازی در مرورگر
3 همه چیز در مورد سشن استوریج در مرورگر
3.1 ظرفیت ذخیره‌سازی سشن استوریج
3.2 مدت زمان نگهداری داده توسط سشن استوریج
3.3 نحوه استفاده از سشن استوریج
3.4 افزودن داده به سشن استوریج

با اگاهی از تفاوت لوکال استوریج (Local storage) با سشن استوریج و کوکی (Cookie)، می‌توانید تصمیمات آگاهانه‌تری در زمینه ذخیره‌سازی داده‌های مرورگر بگیرید که نه تنها به بهبود تجربه کاربر کمک می‌کند بلکه امنیت و کارایی وب‌سایت شما را نیز بهبود میبخشد.

یکی از موضوعات مهمی که هنگام ایونت ترکینگ در آنالیتیکس ۴ با استفاده از گوگل تگ کنیجر اهمیت زیادی پیدا میکندُ مدل ذخیره سازی اطلاعات مربو ط به کاربران سایت است. شاید شما هم بارها با پاپ آپ هایی حاوی پیغام زیر در وب‌سایت‌های مختلف مواجه شده‌اید:

“این وب‌سایت برای ذخیره‌سازی اطلاعات شما از کوکی‌ها استفاده می‌کند.”

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

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

بررسی مختصری از تاریخچه کوکی

در ادامه این مقاله به بررسی تاریخچه کوکی‌ها و تفاوت آن‌ها با لوکال استوریج و سشن استوریج پرداخته‌ایم.

در گذشته، وب‌سایت‌ها از پروتکل HTTP استفاده می‌کردند که امکان ذخیره اطلاعات مرتبط با کاربر مانند شناسه سشن کاربر، نام کاربر و غیره را در اختیار دیجیتال مارکترها قرار نمیداد.

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

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

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

نیاز به افزایش ظرفیت ذخیره‌سازی در مرورگر

در زمان‌های قبل از HTML5، وب‌سایت‌ها برای ذخیره‌سازی اطلاعات کاربر در سمت کلاینت (کاربر)، بیشتر به کوکی‌ها متکی بودند. این کوکی‌ها محدودیت‌هایی از نظر حجم و امنیت داشتند. با معرفی HTML5، API‌های جدیدی برای ذخیره‌سازی اطلاعات در مرورگر کاربران ارائه شد که این محدودیت‌ها را به نحو قابل توجهی کاهش داد.

این API‌های ذخیره‌سازی جدید در دو نوع اصلی عرضه شدند: Local Storage و Session Storage. هر دوی این‌ها بخشی از آبجکت  Window در جاوا اسکریپت هستند، به این معنی است که می‌توانند به طور سراسری در کدهای جاوا اسکریپت که در یک صفحه وب اجرا می‌شوند، دسترسی پیدا کنند.

  • Local Storage: امکان ذخیره‌سازی داده‌ها را بدون انقضا فراهم می‌کند، به این معنی که داده‌ها حتی پس از بستن مرورگر هم باقی می‌مانند.
  • Session Storage: امکان ذخیره‌سازی داده‌ها را به صورت موقتی فراهم می‌کند، به این معنی که داده‌ها با بسته شدن تب مرورگر پاک می‌شوند.

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

همه چیز در مورد سشن استوریج در مرورگر

ابتدا نگاهی به جایگاه سشن استوریج در مرورگر می‌اندازیم:

  • ابزارهای توسعه‌دهنده (Developer Tools) را در مرورگر باز کنید و به زبانه “Application” بروید.
  • در بخش ذخیره‌سازی (Storage)، بخشی با نام “Session Storage” را خواهید یافت.
  • با کلیک بر روی آن، می‌توانید محتوای سشن استوریج مربوط به آن وب‌سایت را مشاهده کنید.

حال، ویژگی‌های سشن استوریج مرورگر را بررسی می‌کنیم.

ظرفیت ذخیره‌سازی سشن استوریج

سشن استوریج بین 5 تا 10 مگابایت داده را در خود ذخیره میکند. مقدار دقیق ظرفیت ذخیره‌سازی با توجه به هر مرورگر متفاوت است، اما این تفاوت چشمگیر نیست!

مدت زمان نگهداری داده توسط سشن استوریج

همانطور که از نام آن پیداست، سشن استوریج تنها تا زمانی که تب مرورگر باز است، داده‌ها را حفظ می‌کند. این به معنای آن است که هر بار که یک تب یا پنجره مرورگر جدیدی باز می‌کنید، یک سشن استوریج جدید ایجاد می‌شود. پس، هر داده‌ای که در سشن استوریج ذخیره می‌کنید، به طور خودکار هنگام بستن آن تب/پنجره حذف می‌شود.

نحوه استفاده از سشن استوریج

برای دسترسی به سشن استوریج از دستورات زیر در بخش کنسول استفاده کنید:

window.sessionStorage

افزودن داده به سشن استوریج

بیایید با استفاده از تابع setItem موجود در شیء sessionStorage، یک جفت کلید-مقدار به سشن استوریج اضافه کنیم:

sessionStorage.setItem(“id”, “123”)

با این کار یک داده جدید در سشن استوریج با کلید id و مقدار 123 قرار میگیرد. اگر بازهم sessionStorage را فراخوانی کنید، مقدار زیر را دریافت خواهید کرد که حاوی اطلاعاتی است که اخیرا به سشن استوریج اضافه کردید:

Storage {id: ‘123’, length: 1}

تفاوت آنالیتیکس ۴ با گوگل تگ منیجر چیست؟

تفاوت آنالیتیکس ۴ با گوگل تگ منیجر چیست؟

در دهه گذشته، تغییرات هیجان‌انگیز بسیاری در زمینه سنجش و تحلیل‌ها رخ داده است که منجر به معرفی و رشد ابزارهای بسیاری شده است. این ابزارها به همراه ویژگی‌ها و به‌روزرسانی‌های دائماً در حال تغییر خود می‌توانند بسیاری از بازاریابان و افرادی که به طور روزانه از آنها استفاده نمی‌کنند را گیج کنند، زیرا دنبال کردن تمام این تغییرات سخت است. گوگل آنالیتیکس  4 یا به اختصار GA4، جانشین یونیورسال آنالیتیکس (UA)، یکی از این ابزارهاست که توسط کسب‌وکارهای کوچک تا بزرگ استفاده می‌شود و در حال تکامل است، به این معنی که همیشه چیزهای بیشتری در رابطه با این ابزار برای یادگیری وجود دارد. آنالیتیکس۴ اغلب به همراه Google Tag Manager استفاده می‌شود.در این بلاگ پست، ما Google Tag Manager را با Google Analytics 4 مقایسه خواهیم کرد تا به عنوان دیجیتال مارکتر با هریک از این ابزارها و تفاوت های این دو باهم، بهتر آشنا شوید.

Google Analytics 4 چیست؟

Google Analytics 4 جانشین Universal Analytics است، ابزار تحلیل وب گوگل که به مدت ۱۲ سال کار می‌کرد و در تاریخ ۱ جولای ۲۰۲۳ (جولای ۲۰۲۴ برای مشتریان ۳۶۰) کار خود را متوقف کرد.

GA4، ابزاری است که انواع داده‌ها در مورد رفتار و تعاملات کاربران را جمع‌آوری می‌کند، یعنی اقداماتی که کاربران در وب‌سایت یا اپلیکیشن انجام می‌دهند و گزارش‌های مختلفی را برای سنجش عملکرد وب‌سایت/اپلیکیشن شما فراهم می‌کند. این ابزار به طور پیوسته در حال تغییر است، به گونه ای که به نظر میرسد یادگیری و آموزش آنالیتیکس ۴ تمامی ندارد!

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

گوگل آنالیتیکس ۴ با ویژگی‌های کلیدی جدیدی وارد عرصه بازاریابی دیجیتال شده است که به ما اجازه می‌دهد درک بهتری از رفتار کاربران داشته باشیم و کمپین‌های بازاریابی خود را با دقت بیشتری هدف‌گذاری و بهینه‌سازی کنیم. در ادامه به برخی از ویژگی‌های اساسی که GA4 ارائه می‌دهد، اشاره می‌کنیم:

  • ردیابی مبتنی بر ایونت: در آنالیتیکس ۴، تمرکز ردیابی اتفاقات بر مبنای ایونت است و نه سشن. این امر به دلیل آن است که ایونتها، که اقداماتی هستند که کاربران انجام می‌دهند، در نتیجه دیدگاه بهتری از میزان تعامل کاربران ارائه می‌دهند.
  • یکپارچه‌سازی داده‌های وب و اپ: GA4 اطلاعات وب‌سایت و اپلیکیشن را در یک پراپرتی جمع‌آوری می‌کند تا درک بهتر و یکپارچه ای از نحوه تعامل کاربر با سایت و اپلیکیشن شما در اختیارتان قرار دهد.
  • اضافه شدن بخش DebugView: عیب‌یابی و رفع مشکلات ایونت ترکینگ در آنالیتیکس ۴ به لطف اضافه شدن بخشی به نام دیباگ ویو آسانتر شده است. شما می‌توانید داده‌های در لحظه را با جزئیات کامل مشاهده کنید تا اطمینان حاصل کنید آنالیتیکس ۴ داده ها را همانطوری دریافت میکند که شما میخواهید.
  • کنترل‌ حریم خصوصی: GA4 حریم خصوصی کاربران را به طور پیش‌فرض بهبود بخشیده و به طور مداوم در تلاش است تا آن را بهتر کند. شما اکنون می‌توانید زمان نگه‌داری داده‌ها و نحوه شناسایی کاربران را تعیین کنید.
  • اتصال به بیگ کوئری: در نسخه یونیورسال تنها کاربرانی میتوانستند از مزایای بیگ کوئری استفاده کنند که از نسخه ۳۶۰ آنالیتیکس استفاده میکردند. اما امکان اتصال بیگ کوئری به آنالیتیکس ۴ در حال حاضر برای تمامی کاربران فراهم شده است.
  • ردیابی بین چند دامنه: با استفاده از GA4، ردیابی کاربران در دامنه‌های مختلف یا همان کراس دامین ترکینگ بسیار آسان‌تر شده است بدون آنکه به دستکاری کد یا استفاده از گوگل تگ منیجر نیاز باشد.

گوگل تگ منیجر (GTM) چیست؟

گوگل تگ منیجر یک سیستم مدیریت تگ (TMS) است که به شما کمک می‌کند تا کدهای ردیابی ابزارهای دیگر مانند GA4 را بدون دستکاری دستی کد وب‌سایت اضافه کنید و ایونت های مختلف را ردیابی کنید.

مانند GA4، استفاده و کار با گوگل تگ منیجر به صورت  رایگان امکان پذیر است. ابزارهای مدیریت تگ دیگری در بازار وجود دارند، مانند Tealium، Adobe Launch و غیره، اما GTM یکی از پرکاربردترین ابزارها است.

تنها کاری که کاربران باید انجام دهند این است که کد GTM را روی وب‌سایت خود نصب کنند و سپس از GTM برای افزودن کد ردیابی ابزارهای دیگر مانند گوگل ادز، متا، X، لینکدین و غیره، تگ‌های ریتارگتینگ و ایونت ترکینگ در صورت نیاز استفاده کنند.

نحوه کار گوگل تگ منیجر به این صورت است که، GTM اطلاعات را از دیتالیر برای استفاده در ساخت ایونت و سپس ارسال آن داده‌ها به ابزارهای دیگر مانند GA4دریافت میکند. بنابراین میتوان گوگل تگ منیجر را واسطه ای بین سایت و دیگر ابزارهای دیجیتال مارکتینگ مانند گوگل آنالیتیکس ۴ و گوگل ادز در نظر گرفت.

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

تفاوت آنالیتیکس ۴ با گوگل تگ منیجر چیست؟

در زمینه بازاریابی و تجزیه و تحلیل داده‌های وب یا همان وب آنالیتیکس، دو ابزار اساسی و متمایز از گوگل وجود دارد: گوگل تگ منیجر (GTM) و گوگل آنالیتیکس (GA4). این دو ابزار در عملکرد و ویژگی‌های خود تفاوت‌های اساسی دارند که درک آنها برای بازاریابان دیجیتال اهمیت زیادی دارد.

  • جمع‌آوری داده‌ها: GTM وظیفه ردیابی و جمع‌آوری داده‌ها را بر عهده دارد اما آنها را ذخیره نمی‌کند. این در حالی است که GA4 علاوه بر جمع‌آوری، قابلیت ذخیره‌سازی داده‌ها را نیز دارد. بنابراین، GTM به عنوان یک واسط برای ردیابی، جمع‌آوری و ارسال داده‌ها به GA4 عمل می‌کند.
  • گزارش‌دهی: GA4 توانایی‌های گزارش‌دهی قوی دارد که اجازه می‌دهد تجزیه و تحلیل‌های مختلفی انجام شود. اما این امکان با استفاده از GTM وجود ندارد، زیرا GTM هیچ گونه گزارش‌دهی انجام نمی‌دهد.
  • یکپارچگی: فقط می‌توان رویدادهای خاصی را که مربوط به GA4 هستند از طریق GTAG (که شامل کدنویسی مستقیم است) ردیابی کرد. اما با استفاده از GTM، می‌توان رویدادها را برای سایر پلتفرم‌ها نیز ردیابی کرد و آنها را در یک مکان مدیریت نمود.
  • ایونتها: هنگام استفاده از GA4 برای ردیابی رویدادها، باید از الگوی کد مشخصی پیروی کرد و این قطعات کد باید برای تمام رویدادهایی که می‌خواهید ردیابی کنید، در وب‌سایت قرار گیرند. مانند مثال زیر که button_click به عنوان رویداد با پارامتر button_text است.

با استفاده از GTM، می‌توانید ایونتها را با ایجاد تگ ایونت GA4 و تنظیم شرایطی (معروف به تریگر) که در آنها باید این ایونتها جمع‌آوری و به GA4 ارسال شوند، ردیابی کنید.

  • کانورژن ها: GTM ایونتها را به GA4 می‌فرستد. این سیستم نمی‌داند آیا آنها کانورژن هستند چرا که کانورژن ها در رابط کاربری GA4 پیکربندی می‌شوند.
  • کاربران: کاربران هر دو ابزار ممکن است متفاوت باشند. GA4 معمولاً مخاطبان گسترده‌تری دارد که در آن دیجیتال مارکترها، مدیران محصول/پروژه و سایر ذینفعان مایل به کسب اطلاعات مهم هستند. GTM به طور کلی محل بازی افرادی است که به جنبه‌های فنی نسبت به گزارش‌دهی و تحلیل علاقه بیشتری دارند.

درک این تفاوت‌ها برای در پرفورمنس مارکتینگ ضروری است تا بتواند از توانایی‌های هر دو ابزار به نحو احسن استفاده کند و استراتژی‌های بازاریابی دیجیتال خود را به بهترین شکل ممکن پیاده‌سازی نماید.

چه زمانی باید از Google Tag Manager به جای Google Analytics 4 استفاده کنیم؟

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

بله، شما می‌توانید بدون استفاده از GTM از GA4 استفاده کنید، اما با استفاده از GTM، پیاده‌سازی و مدیریت تگ‌ها آسان‌تر و منظم‌تر می‌شود. در غیر این صورت، شما برای تغییرات جزئی نیز به شدت به توسعه‌دهندگان وابسته خواهید بود که این امر منجر به تاخیر در انجام کارها می‌شود.

به همین ترتیب، استفاده از GTM بدون GA4 امکان‌پذیر است، اما این اتفاق به ندرت می‌افتد. صادقانه بگوییم، استفاده نکردن از GTM برای نصب GA4 در وب‌سایت/اپ خود و ارسال داده‌ها به GA4، چندان منطقی به نظر نمی‌رسد، زیرا با استفاده از GTM می‌توانید تغییرات را به صورت سریع و آسان اعمال کنید.

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

ادامه مطلب
بهترین تکنیک‌های جاوا اسکریپت برای گوگل تگ منیجر

بهترین تکنیک‌های جاوا اسکریپت برای گوگل تگ منیجر

شاید ندانید، اما هنگامی که از Google Tag Manager استفاده می‌کنید، در واقع کدهای جاوااسکریپتی را پیکربندی می‌کنید که به دنبال ردیابی تعاملات در وب‌سایت هستند. Google Tag Manager درواقع یک رابط کاربری آسان برای انجام این کار ارائه می‌دهد، بنابراین هنگام کار با آن نیازی به دانش برنامه نویسی نیست! با این حال، هرچه بیشتر با Google Tag Manager کار کنید، بیشتر نیازمند درک و استفاده از جاوااسکریپت برای پیشبرد تحلیل‌های خود خواهید بود. استفاده از جاوااسکریپت در تگ های Custom HTML، متغیرهای جاوااسکریپت، یا تمپلیت های سفارشی، انعطاف‌پذیری بیشتری به شما می‌دهد تا اطلاعات دقیق‌تری در مورد نحوه تعامل کاربران با سایت خود به دست آورید. اگر به برنامه‌نویسی علاقه‌مند هستید اما تازه‌کار هستید، یادگیری جاوااسکریپت ممکن است چالش‌برانگیز به نظر برسد. اما بالاخره باید از جایی شروع کرد، درست است؟ این آموزش به شما کمک خواهد کرد تا با استفاده از پنج موضوع کلیدی در مورد جاوااسکریپت برای گوگل تگ منیجر، پیاده سازی و اجرای ایونت ترکنیگ خود را بهتر پیش ببرید.

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

چرا یادگیری جاوا اسکریپت برای دیجیتال مارکترها ضروری است؟

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

برای دیجیتال مارکترها، دانستن نحوه به‌کارگیری جاوا اسکریپت در Google Tag Manager به منظور افزودن اسکریپت‌های سفارشی به وب‌سایت بدون دستکاری مستقیم کد وب، یک مهارت کلیدی است. اگر به دنبال افزایش دانش خود در زمینه جاوا اسکریپت هستید، پیشنهاد میکنم دوره‌های رایگان جاوا اسکریپت ارائه شده توسط W3Schools را شرکت کنید.

مفاهیم پایه جاوا اسکریپت برای گوگل تگ منیجر

در دنیای بازاریابی دیجیتال و بهینه‌سازی سایت‌ها، داشتن دانش برنامه‌نویسی، به‌خصوص در JavaScript، می‌تواند یک مزیت رقابتی به‌شمار آید. در این راستا، شناخت سینتکس (دستورالعمل نوشتاری کد) JavaScript و تفاوت‌های موجود میان نسخه‌های مختلف آن، از اهمیت ویژه‌ای برخوردار است.

امروزه، نسخه فعلی JavaScript که به‌عنوان ECMAScript 6 (ES6) شناخته می‌شود، تحولات قابل توجهی را در نحوه نوشتار کدها به ارمغان آورده است. با این حال، نکته قابل توجه برای دیجیتال مارکترها و کارشناسان SEO این است که اگرچه Google Tag Manager (GTM) از ES6 پشتیبانی می‌کند، اما در تگهای کاستوم HTML یا متغیرهای کاستوم JavaScript، تنها به نسخه ES5 وفادار مانده است.

این تفاوت‌های نسخه‌ای می‌تواند برای دیجیتال مارکترها به‌ویژه زمانی که در تلاش برای اجرای اسکریپت‌های پیچیده در GTM هستند، حائز اهمیت باشد. به‌عنوان مثال، یکی از ویژگی‌های کلیدی ES6، معرفی Arrow Functions است که سینتکس ساده‌تر و خواناتری برای تعریف توابع فراهم می‌آورد. با این حال، این توابع در ES5 و در نتیجه در بخش‌هایی از GTM که تنها از ES5 پشتیبانی می‌کنند، قابل استفاده نیستند.

تعریف و مقدار دهی متغیرها در جاوا اسکریپت

در عرصه برنامه‌نویسی، تعریف متغیرها یکی از اصول پایه‌ای است که به ما امکان می‌دهد تا با اختصاص دادن نام به مقادیر یا اشیاء، به داده‌ها دسترسی پیدا کنیم. این امر با استفاده از متغیرها، که به عنوان نماینده‌ای از داده‌ها عمل می‌کنند، امکان‌پذیر است. نحوه تعریف متغیرها بین نسخه‌های مختلف جاوا اسکریپت، مانند EC5 و EC6، متفاوت است.

در نسخه EC5، متغیرها با کلیدواژه var تعریف می‌شوند. این کلیدواژه انعطاف‌پذیری بالایی دارد اما محدودیت‌هایی نیز به همراه دارد.

var clothingBrand = ‘Nike’;
var price = 1500;

در حالی که نسخه EC6، با استفاده از const و let، میتوان متغیر تعریف کرد:

const clothingBrand = ‘Nike’;
const price = 1500;

مهمترین نکات هنگام استفاده از جاوا اسکریپت برای گوگل تگ منیجر

در ادامه این مطلب به پنج موضوع کلیدی در رابطه با استفاده از جاوااسکریپت در Google Tag Manager می‌پردازد که به دانش فنی پیچیده‌ای نیاز ندارند.

دیتالیر

یک وب سایت معمولاً دارای سه لایه است: آنچه کاربران شما می بینند، لایه ابزارهای متصل به وب سایت (مانند Google Analytics و Google Tag Manager) و دیتالیر، جایی که داده های تولید شده توسط کاربر ذخیره می شود. Data Layer یک روش قابل اعتماد برای جمع آوری داده ها از وب سایت در اختیار شما قرار می دهد. مقادیر داخل این لایه اغلب توسط Google Tag Manager برای ارسال اطلاعات به تگ ها استفاده می شود. این اطلاعات شامل ایونتها، متغیرها و تریگر هایی هستند که می توانند بر اساس مقادیر متغیرها تنظیم شوند. به محض اینکه کد نصب تگ منیجر روی سایت قرار بگیرد، دیتالیر هم به صورت خودکار ایجاد می شود.

بنابراین زمانی که میخواهید مطمئن شوید که تگ منیجر روی یک سایت به درستی کار میکند یا نه، اولین کاری که باید انجام دهید این است که به دیتا لیر نگاهی بیاندازید. یک راه سریع و راحت برای دسترسی به دیتا لیر، حتی بدون دسترسی به Tag Assistant، استفاده از Developer Tools در مرورگر است. اگر از Google Chrome استفاده می‌کنید، به منوی برنامه‌ها، سپس More Tools و سپس Developer Tools بروید. برای دسترسی به این بخش میتوانید از میانبر صفحه کلید Ctrl+Shift+I برای ویندوز یا Cmd+Shift+I برای مک هم استفاده کنید.

در تب Console، dataLayer را تایپ کنید، سپس Enter را فشار دهید.

با بررسی این بخش میتوانید مطمئن شوید که اطلاعات به درستی ذخیره شده اند یا نه.

انواع داده‌ها و ساختار داده در جاوا اسکرپیت

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

  • رشته‌ها (Strings) مجموعه‌ای از کاراکترها هستند که در ” ” قرار می‌گیرند و به عبارتی، متن محسوب می‌شوند. برای مثال، var clothingBrand = 'Nike'; نام یک برند لباس را نشان می‌دهد.
  • اعداد (Numbers) یک مقدار عددی هستند. برای نمونه، var price = 15; قیمت یک کالا را نشان می‌دهد.
  • بولین (Booleans) فقط می‌توانند یکی از دو مقدار true یا false را داشته باشند. این نوع داده‌ها برای عملیات منطقی و تصمیم‌گیری در کد استفاده می‌شوند. به عنوان مثال، var isOnSale = true; نشان می‌دهد که یک کالا در حال فروش است.

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

var clothingCategories = [‘shoes’, ‘t-shirts’, ‘pants’];
var firstElement = myArray[0]; // returns ‘shoes’
var dataTypes = [‘string’, 1, true, [1, 2, 3]]; // arrays can hold multiple data types

به طور مشابه، یک آبجکت می تواند چندین مقدار از انواع داده های مختلف را در خود نگه دارد.یک آبجکت شامل جفت های کلید-مقدار است که توسط {} مشخص می شوند.

var objectExample = {key: value}; // Example
var itemDetails = {
materialComposition: {
‘cotton’: 70,
‘linen’: 30
},
price: 30,
onSale: false,
searchTags: [‘t-shirt’, ‘women’, ‘tops’]
};

توابع جاوا اسکریپت

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

function priceAfterTax(price, tax) {
return price * (1 + tax);
};

هنگام ایجاد متغیرهای جاوا اسکریپت سفارشی در GTM، از توابع ناشناس استفاده می شود، منظور توابعی است که اسم مشخصی نداشته و در نتیجه در ادامه فراخوانی نمی شوند. به عنوان مثال کد زیر شامل یک تابع ناشناس است:

function () {
for (var e = document.getElementsByTagName(“iframe”), x=0; x < e.length; x++) {
if (/^https?:\/\/player.vimeo.com/.test(e[x].src)) {
return true;
}
}
return false;
}

دستورات شرطی (یا دستورات if) زمانی مورد استفاده قرار میگیرند که بر اساس بررسی یک سری شرایط خاص روی ورودی، یک سری عملیات خاص انجام میدهند. این دستورات اغلب در توابع برای برگرداندن خروجی های مختلف بسته به ورودی استفاده می شوند.در کد زیر، بسته به قیمت کالا، برای اینکه ارسال رایگان باشد یا خیر، تابع یک مقدار بولین برمی‌گرداند.

function freeShipping(price) {
if (price < 100) {
return false;
} else {
return true;
}
};

اسکوپ در جاوا اسکرپیت

Scope قابلیت دسترسی به یک متغیر، شی و تابع را از قسمت های مختلف کد تعریف می کند.دو اسکوپ اصلی برای EC5 وجود دارد: جهانی (global) و function (معروف به محلی). زمانی که یک متغیر به صورت گلوبال تعریف می شود، بدون هیچ محدودیتی میتوان در سراسر کد به آن دسترسی داشت. اما در حالت تابع، متغیر فقط در سطح همان تابعی که تعریف شده است، در دسترس است و بیرون از همان تابع نمیتوان به آن دسترسی داشت. در مثال زیر، نمی‌توانید به متغیر isFreeShipping خارج از تابع دسترسی داشته باشید زیرا این متغیر داخل تابع تعریف شده است.با این حال، می‌توانید از متغیر shippingCost و تابع addShippingCost در توابع دیگر استفاده مجدد کنید.

var shippingCost = 10; // Global scope
function addShippingCost(price) {
var isFreeShipping = freeShipping(price) // Function-Local scope
if (isFreeShipping) {
return price;
} else {
return price + shippingCost;
}};

با توجه به این موضوع، هنگام تعریف متغیر در جاوا اسکریپت به موضوع اسکوپ و میزان دسترسی به متغیرها توجه داشته باشید. اگر نیاز دارید که به یک متغیر در توابع مختلفی دسترسی داشته باشید، باید متغیر را به صورت گلوبال تعریف کنید.

کار با داده از جنس رشته یا string

برای دسترسی به بخشی از یک متن باید از توابع مربوط به رشته ها استفاده کنید. روش .split() یکی از مهمترین توابعی است که هنگام کار با داده از جنس استرینگ مورد استفاده قرار میگیرد. سایر توابع کاربردی مرتبط با داده از نوع رشته عبارت هستند از:

  • .slice() – قسمت مشخص شده یک رشته را استخراج می کند و یک رشته جدید برمی گرداند.
  • .concat () – دو یا چند رشته به هم پیوسته را برمی گرداند.
  • .lowerCase() – رشته مشخص شده را با تمام حروف کوچک برمی گرداند.
  • .upperCase() – رشته مشخص شده را در تمام حروف بزرگ برمی گرداند.

کار با آرایه ها در جاوا اسکریپت

همانطور که قبلاً به گفتیم، آرایه‌ها مانند فهرست‌هایی از اطلاعات سازمان‌یافته هستند که ذخیره و ترتیب اطلاعات از انواع داده‌های مختلف را آسان می‌کنند.همانند رشته‌ها، می‌توانید از انواع توابع مربوط به آرایه ها برای دستکاری این نوع داده ها استفاده کنید. برخی از کاربردی ترین توابع مربوط به آرایه ها عبارت هستند از:

  • .push() – یک یا چند عنصر را به انتهای یک آرایه اضافه می کند (از این تابع برای وارد کردن دیتا به دیتالیر گوگل تگ منیجر استفاده می شود)
  • .pop() – آخرین عنصر آرایه را حذف و برمی گرداند.
  • .find() – اولین عنصر آرایه ای که شرایط مشخص شده را بدون تغییر آرایه اصلی برآورده می کند، پیدا کرده و برمی گرداند.
  • .slice() – نباید با .splice() اشتباه گرفته شود، این متد بخشی از آرایه بین دو شاخص مشخص شده را به عنوان یک آرایه جدید برمی گرداند.
  • .map() – یک آرایه جدید را پس از فراخوانی یک تابع در هر عنصر آرایه اصلی برمی گرداند.
  • .forEach() – به شما امکان می دهد از هر عنصر در یک آرایه عبور کنید و با استفاده از آن عنصر عملیاتی را انجام دهید، اما – برخلاف .map() – چیزی را بر نمی گرداند.
  • .includes() – یک بولین را بر اساس اینکه آیا آرایه حاوی عنصر مشخص شده است (این روش به حروف کوچک و بزرگ حساس است) برمی گرداند.
  • .filter() – یک آرایه جدید حاوی هر عنصر در آرایه اصلی که شرایط مشخص شده را برآورده می کند، برمی گرداند.

منظور از DOM در جاوا اسکریپت

Document Object Model که به اختصار DOM نامیده می شود، نمایشی پویا از ساختار و محتوای یک وب سایت است. هنگامی که یک وب سایت را باز می کنید، مرورگر یک فایل HTML را از سرور وب سایت دانلود می کند و آنچه را که در سایت می بینید با استفاده از HTML، CSS و جاوا اسکریپت تولید می کند. سپس، DOM ساخته می‌شود و به کمک جاوا اسکریپت اجازه دسترسی به مقادیر خاصی از وب‌سایت را می‌دهد.

هنگامی که کاربران از سایت شما بازدید می کنند، کد ردیابی Google Analytics 4 از ایونت DOM برای ردیابی ایونت هایی مانند کلیک روی یک المان استفاده میکند.

دستور کوئری سلکتور (Query Selector)

تکنیک بعدی که می توانیم برای استفاده از جاوا اسکریپت برای گوگل تگ منیجر استفاده کنیم، روش کوئری سلکتور است. همانطور که پیش از این گفته شد، لایه ای از سایت که کاربران مشاهده میکنند، متشکل از HTML و CSS است. ما زمانی که بخواهیم به یک المان خاص در صفحه اشاره کنیم، میتوانیم از سی اس اس سلکتور آن المان استفاده کنیم. اما برای اینکه مطمئن شویم سلکتور انتخاب شده به صورت دقیق به المان مد نظر ما اشاره میکند، باید از دستور کوئری سلکتور در بخش کنسول اینسپکت استفاده کنیم.

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

ادامه مطلب
آموزش یوزر آیدی ترکینگ در آنالیتیکس ۴

آموزش یوزر آیدی ترکینگ در آنالیتیکس ۴

در عصر دیجیتال امروز، داشتن درکی دقیق از رفتار بازدیدکنندگان وب‌سایت شما برای موفقیت آنلاین حیاتی است. گوگل آنالیتیکس ۴ (GA4) سه روش برای شناسایی افرادی که از وب‌سایت شما بازدید می‌کنند ارائه می‌دهد: یوزر آیدی، گوگل سیگنال و دیوایس. در این محتوا از سری محتواهای آموزش آنالیتیکس ۴، ما بر روی “یوزر آیدی ترکینگ در آنالیتیکس ۴” تمرکز خواهیم کرد، که برای بهبود نرخ کانورژن و درک بهتر رفتار کاربران حیاتی است.

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

در این پست، من توضیح خواهم داد چگونه “یوزر آیدی ترکینگ در آنالیتیکس ۴” را با استفاده از Google Tag Manager ردیابی کنید. این محتوا نه تنها به شما کمک می‌کند تا دید بهتری نسبت به رفتار بازدیدکنندگان وب‌سایت خود داشته باشید، بلکه امکان بهینه‌سازی تجربه کاربری و افزایش نرخ تبدیل را نیز فراهم می‌آورد. به‌کارگیری این استراتژی‌ها می‌تواند به شما امکان دهد تا در بازار رقابتی امروز، یک گام جلوتر باشید.

منظور از یوزر آیدی ترکینگ چیست؟

یوزر آیدی ترکینگ به معنای اتصال شناسه‌ی ثابت از یک کاربر واحد با اطلاعات تعامل آن کاربر در یک یا چند سشن در یک یا چند دستگاه (و البته، مرورگرها) است.

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

چگونه یوزر آیدی را برای آنالیتیکس ۴ ارسال کنیم؟

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

بعد از ایجاد گوگل تگ، باید پارامتر user_id را در این تگ قرار داده و با ساخت متغیر در تگ منیجر، آن را مقداردهی کنید. با انجام این کار، این دیتا همراه با تمام ایونت هایی که به آنالیتیکس ۴ مرتبط شده اند، در آنالیتیکس در دسترس خواهد بود. اما برای جلوگیری از هرگونه خطا و از دست رفتن دیتا، بهتر است که این پارامتر به صورت مجزا همراه با مابقی ایونتها هم برای آنالیتیکس ارسال شود.

اگر کاربری به صورت ناشناس وارد وب‌سایت شما شود (یعنی وارد حساب کاربری خود نشده باشد)، متغیر یوزر آیدی مقدار undefined را میگیرد و بنابراین، یوزر آیدی به GA4 ارسال نمی‌شود. اما به محض اینکه کاربر وارد حساب کاربری خود میشود، این شناسه یا همان آیدی باید در دسترس باشد. سپس مابقی ایونت های GA4  باید یوزر آیدی را دریافت کنند و گوگل تگ هم هنگام لود شدن صفحه بعدی این آیدی را دریافت کند.

نکات مهمی که قبل از یوزر آیدی ترکینگ در آنالیتیکس ۴ باید بدانید

هرچیزی را نمیتوان به عنوان یوزر آیدی برای آنالیتیکس ۴ ارسال کرد

درک این نکته حائز اهمیت است که شرایط خدمات گوگل آنالیتیکس اجازه ردیابی اطلاعات شخصی قابل شناسایی (PII) مانند آدرس ایمیل، شماره تأمین اجتماعی و غیره که بر روی سرورهای کسب و کار ذخیره می‌شوند را نمی‌دهد. همین اصل در مورد “یوزر آیدی ترکینگ در آنالیتیکس ۴” نیز صدق می‌کند. حتی اگر شما از آدرس ایمیل برای شناسایی کاربران در سیستم CRM و غیره خود استفاده می‌کنید، نمی‌توانید از ایمیل به عنوان یوزر آیدی در گوگل آنالیتیکس استفاده کنید.

درواقع شما می‌توانید از یوزر آیدی شامل اعداد، حروف و غیره به صورت تصادفی، مانند ۱۲۳۴۵۶۷ یا ۱۲۳aboasdb۲۲۳۴ استفاده کنید. این موارد یوزر آیدی‌های قابل قبولی هستند که می‌توانید در گوگل آنالیتیکس استفاده کنید.

پس به صورت خلاصه میتواند گفت که:

  • johndoe@businessemail.com – نمی‌توان به عنوان یوزر آیدی در گوگل آنالیتیکس استفاده کرد
  • 5239asbd923fade923da – می‌توان به عنوان یوزر آیدی در گوگل آنالیتیکس استفاده کرد.

یوزر آیدی روی داده های هیستوریکال (بیشتر از ۱ سشن) اعمال نمی شود

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

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

طول یوزر آیدی باید حداکثر ۲۵۶ کاراکتر باشد

حداکثر طول یوزر آیدی که می‌توانید برای گوگل آنالیتیکس ۴ ارسال کنید، ۲۵۶ کاراکتر یونیکد است.

یوزر آیدی هر کاربر باید با تمامی ایونت ها برای آنالیتیکس ۴ ارسال شود

زمانی که یوزر آیدی کاربر در دسترس است، باید این دیتا همراه با تمامی ایونت ها برای آنالیتکس ۴ ارسال شود. به همین دلیل باید فیلد یوزر آیدی در تگ نصب GA4 به عنوان یک پارامتر تعیین شود. اما برای اطمینان از اینکه این دیتا همراه با تمامی ایونت ها در دسترس است، باید موقع ساخت ایونت در تگ منیجر و یا همان ایونت ترکینگ در آنالیتیکس ۴، باید از گوگل تگ استفاده شود.

چطور میتوان یوزر آیدی را دریافت کرد؟

برای دسترسی به یوزر آیدی بسته به نحوه کدنویسی وب‌سایت میتوانید از هریک از روش هایی که در ادامه معرفی می شود، استفاده کنید.

روش شماره ۱: همکاری با توسعه دهنده برای ارسال یوزر آیدی به دیتالیر یا استفاده از افزونه

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

window.dataLayer = window.dataLayer || [];

window.dataLayer.push({

  ‘event’: ‘login’,

  ‘userId’: ‘1234567’ // این عدد باید با یوزر آیدی واقعی جایگزین شود

});

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

اما اگر با یک سایت سینگل پیج اپلیکیشن سر و کار دارید، جایی که این کد دیتالیر را قرار میدهید و یا استفاده از event ، خیلی مهم نیست.

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

window.dataLayer = window.dataLayer || [];

window.dataLayer.push({

  ‘userId’: ‘1234567’ // این عدد باید با یوزر آیدی واقعی جایگزین شود

});

پس از اینکه دولوپر یوزر آیدی را برای دیتالیر کرد، وارد Google Tag Manager شوید، به کانتینر وب‌سایتی که در حال حاضر روی آن کار می‌کنید بروید، و حالت دیباگ مود را فعال کنید.

به وب سایت خود بروید و اگر لاگین کرده بودید، خارج شوید. پس از آن بک بار دیگر لاگین کنید، با انجام این کار باید یک ایونت login در بخش کنسول دیباگ مود تگ منیجر ظاهر شود. بعد از آن باید به دنبال پارامتر userId باشید، این پارامتر باید حاوی مقدار درست یوزر آیدی یا شناساه کاربری شما باشد.

نکته مهم: اگر با سایت سازهای معروفی مانند وردپرس کار می‌کنید، احتمال دارد که افزونه‌های آماده Google Tag Manager برای یوزر آیدی ترکینگ در آنالیتیکس ۴ وجود داشته باشد. به عنوان مثال، افزونه وردپرس به نام GTM4WP میتواند برای ارسال user id به آنالیتیکس ۴ در سایت های وردپرسی استفاده شود.

برای اینکه بتوانید از اطلاعاتی که دولوپر از طریق دیتالیر برای شما ارسال کرده است، استفاده کنید، نیاز است که این دیتا را به یک متغیر در تگ منیجر تبدیل کنید. برای انجام این کار میتوانید از متغیر دیتالیر در تگ منیجر که یکی از متغیرهای از پیش ساخته شده است، استفاده کنید. نکته حائز اهمیت این است که هنگام وارد کردن اسم دیتا در متغیر دیتا لیر، به کوچک یا بزرگی حروف دقت کنید.

روش شماره ۲: ذخیره کردن userid در کوکی

هنگامی که به دنبال یک روش جهت دریافت یوزر آیدی از سایت هستید، میتوانید به سیو کردن userid در کوکی هم فکر کنید! درواقع این امکان وجود دارد که در سایت، فروشگاه یا هر پلتفرم دیگری که روی آن کار می‌کنید، از قبل یوزر آیدی در یک کوکی ذخیره شده باشذ. در این صورت، می‌توانید با استفاده از Google Tag Manager مقدار آن را بخوانید و سپس آن را به Google Analytics ارسال کنید. اگر به طور مستقیم به دولوپر وب‌سایت، فروشگاه و غیره دسترسی دارید، از آن‌ها بپرسید که آیا یوزر آیدی را در یک کوکی ذخیره می‌کنند یا نه و اگر بله و نام آن چیست.

در غیر این صورت، می‌توانید خودتان بررسی کنید که آیا چیزی شبیه به یوزر آیدی در اطلاعات کاربر در بخش کوکی وجود دارد یا نه. برای انجام این کار باید به بخش دولوپر تولز مررورگر خود بروید. من از کروم استفاده می‌کنم، بنابراین به More Tools و بعد از آن Developer Tools می‌روم.

سپس به Application > Cookies بروید و دامنه وب‌سایت خود را انتخاب کنید.

حالا به دنبال نامی بگردید که ممکن است حاوی اطلاعات یوزر آیدی باشد. توجه داشته باشید که هیچ نام استانداردی برای آن وجود ندارد و در هر سایتی ممکن است این شرایط متفاوت باشد. (تصویر زیر مربوط به سایت نماوا است)

پس از پیدا کردن چیزی شبیه به یوز آیدی، میتوانید با همکاری با تیم دیتا یا توسعه دهنده سایت، مطمئن شوید این آیدی همان چیزی هست که به آن نیاز داشتید.

بعد از آن، باید با ایجاد یک متیغر در گوگل تگ منیجر، مقدار یوزر آیدی را از طریق کوکی دریافت کرده و در تگ و یا ایونت های مد نظرتان استفاده کنید.

روش شماره 3: استفاده از متغیر جاوا اسکریپت

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

اما چگونه این کار را انجام دهید؟

  • گزینه الف: از دولوپر سایت کمک بگیرید.
  • گزینه ب: خودتان آن را پیدا کنید. برای شروع جستجو، به بخش دولوپر تولز کروم بروید. در بخش کنسول، عبارت window را وارد کنید. روی مثلث سیاه نزدیک به Window کلیک کنید تا لیستی از ویژگی‌هایی که می‌توانیم با یک متغیر جاوا اسکریپت در GTM به آنها دسترسی پیدا کنیم را ببینید.

بعد از پیدا کردن متغیری شبیه به یوزر آیدی، به رابط کاربری Google Tag Manager بروید > Variables > New > JavaScript Variable و سپس کل مسیری که از بالا به پایین برای رسیدن به متغیر گلوبال طی کردید را بنویسید و اسم هر بخش را با . از هم جدا کنید. به خاطر داشته باشید که با استفاده از این روش که درواقع چایلد و پرنت هست ما به درستی آدرس دهی میکنیم و مشخص میکنیم که به دنبال چه متغیری در کجای سایت هستیم.

بعد از انجام این کار، حتما دیباگ مود را چک کنید تا ببنید که آیا متغیر شما با مقدار یوزر آیدی پر شده است یا نه. اگر مشکلی وجود داشت، مطمئن شوید که درست آدرس دهی کرده اید و یا غلط املایی ندارید.

روش شماره ۴: استخراج اطلاعات از DOM

به طور خلاصه، استخراج اطلاعات از DOM روشی برای دریافت یک مقدار از مدل شیء سند وب‌سایت از طریق استخراج آن است. پس اگر شما به عنوان یک کاربر وارد شده و شناسه کاربری خود را جایی در رابط کاربری مشاهده کنید، می‌توانید با کمک متغیر DOM یا متغیر جاوا اسکریپت سفارشی در Google Tag Manager، مقدار آن را استخراج کنید. استفاده از استخراج اطلاعاتDOM  می‌تواند به تغییرات احتمالی زیاد، به ویژه در وب‌سایت‌هایی که توسعه‌دهندگان به طور مداوم در حال پیاده‌سازی تغییرات یا اجرای تست AB در رابط کاربری هستند، ریسکی است.

درواقع متغیر DOM به شما امکان را می‌دهد تا یک عنصر از وب‌سایت را انتخاب کرده و متن آن یا یکی از اتریبیوشن های HTML آن (مانند href، title، ID و غیره) را بخوانید. شما می‌توانید با تعریف ID آن (در صورت وجود) یا با استفاده از انتخاب‌گرهای CSS، یک عنصر را انتخاب کنید.

با توجه به اینکه برای استفاده از این روش نیاز به دانش در زمینه HTML و CSS است و تمامی وب سایت های موجود در جهان احتمالا از یک شیوه خاصی استفاده میکنند، میتوان گفت که روش مشخصی برای دریافت اطلاعات از DOM وجود ندارد. اما اگر به اندازه کافی خوش شانس باشید، شاید المانی که قصد دریافت آن را دارید، دارای یک ID باشد. در غیر این صورت باید از CSS سلکتور استفاده کنید. فقط فراموش نکنید که چندین عنصر در یک صفحه ممکن است توسط همان انتخاب‌گر CSS مشخص شده باشند. به همین دلیل باید از متد document.querySelectorAll() برای اطمینان از استخراج فقط آن عنصری که شامل یوزر آیدی است، استفاده کنید.

توجه داشته باشید که ممکن است با تغییراتی که دولوپر در سایت ایجاد میکند، ساختار سی اس اس سلکتور یا آی دی هم تغییر کرده و در نتیجه نحوه دریافت دیتا هم تغییر کند.

اطلاعات مربوط به یوزر آیدی را در کدام بخش از آنالیتیکس میتوان مشاهده کرد؟

برای اینکه قادر به مشاهده گزارش یوزر آیدی در آنالیتیکس ۴ باشید، باید قبل از هرچیز، این اطلاعات را همراه با گوگل تگ برای آنالیتیکس ارسال کنید.

برای پیاده‌سازی ردیابی شناسه کاربر، باید پارامتر user_id را با هر ایونت (هنگامی که کاربر وارد سایت می‌شود) به گوگل آنالیتیکس ۴ ارسال کنیم. برای اطمینان از اینکه این دیتا همراه با تمامی ایونت ها در آنالیتیکس در دسترس است، باید این دو کار را انجام دهیم:

۱. تگ گوگل: تگ گوگل را باز کرده، روی Configuration settings کلیک کنید، سپس پارامتر اضافه کنید و user_id را وارد کنید. مقدار این پارامتر باید متغیری باشد که شناسه واقعی کاربری را که در وب‌سایت شما وارد سایت می‌شود، برمیگرداند.

۲. متغیر تنظیمات ایونت: باید شناسه کاربر را با هر ایونت به گوگل آنالیتیکس ۴ ارسال کنید (زمانی که کاربر وارد سایت شده است).  برای این کار می‌توانید به صورت دستی پارامتر user_id را در تمام تگ‌های رویداد GA4 تنظیم کنید، یا از Event Settings Variable استفاده کنید. من گزینه دوم را توصیه می‌کنم.

اگر هنوز Event Settings Variable را ایجاد نکرده‌اید، به بخش Variables بروید، بعد New و سپس Variable Configuration را انتخاب کنید و Google Tag: Event settings را انتخاب کنید.

در این متغیر، روی اضافه کردن پارامتر کلیک کنید و user_id را وارد کنید. مقدار این پارامتر باید متغیری باشد که شناسه واقعی کاربری را که در وب‌سایت شما وارد سیستم می‌شود، برگرداند.

متغیر را ذخیره کنید. حالا، شما باید این متغیر را به تگ تمام ایونت های GA4 اضافه کنید (اگر قبلاً این کار را انجام نداده‌اید). هر یک از تگهای ایونت GA4 را باز کنید، سپس روی Event Parameters کلیک کنید و متغیری که قبلا ایجاد کرده اید را انتخاب کنید. این مراحل را باید برای تمامی ایونت هایی که در کانتینر تگ منیجر و برای آنالیتیکس ۴ دارید، تکرار کنید.

پس از ایجاد متغیر یوزر آیدی، پارامتر user_id را در تنظیمات تگ گوگل و متغیر تنظیمات ایونت GA اضافه کنید، سپس حالت پیش‌نمایش GTM را با کلیک بر روی دکمه پیش‌نمایش در گوشه بالا سمت راست رابط کاربری GTM فعال کنید.

سپس، باید ببینید که تگ گوگل شما فعال شده است. روی آن کلیک کنید.

اگر در حالت پیش‌نمایش GTM شناسه کاربر را دیدید، نوبت آن رسیده است که به بخش دیباگ ویو در آنالیتیکس ۴ مراجعه کنید. باید روی ایونت هایی که برای آنالیتیکس ارسال می شود، کلیک کنید و متغیر یوزر آیدی به همراه مقدار صحیح آن را مشاهده کنید.

ادامه مطلب

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

Search

آخرین مطالب​

من نگار پورجواد هستم. علاقه‌مند به مباحث دیجیتال مارکتینگ، پرفورمنس مارکتینگ، سئو و بازاریابی محتوا.

Twitter Linkedin Youtube Instagram Telegram

دسته بندی ها

دسته‌ها

آخرین دوره ها

دریافت مشاوره و آموزش

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