در یکپارچهسازی با استفاده از Google Tag Manager
بدون تغییر Source Code
میتوان SDK متریکس را در وبسایت خود پیادهسازی کنید.
برای این کار ابتدا مستندات مربوط به
WebSDK
را مطالعه کرده سپس به ادامه همین مطلب بازگردید.
در Google Tag Manager سه تعریف وجود دارد؛ که برای پیادهسازی به این سه تعریف نیازمندیم.
Folder: فولدرها برای دستهبندی Tagها و Triggerها بکار میروند.
Tag: تمامی کدهای مربوط به SDK درون Tagها پیادهسازی میشوند. و زمان اجرای آنها توسط Triggerها مشخص میشود.
Trigger: مدت زمان اجرای Tagها را مشخص میکنند.
پیادهسازی
ایجاد Folder متریکس
با استفاده از تب
Folders
یک فولدر با نام Metrix SDK
ایجاد کنید.
انجام این مرحله
الزامی ندارد اما برای دستهبندی مناسب
Tag
ها و
Trigger
ها از اهمیت ویژهای برخوردار است.
حال شما میتوانید Tag ها Trigger های مربوط به پیادهسازی SDK را درون این فولدر قرار دهید.
اضافهکردن Script متریکس و شروع به کار آن
برای اضافه کردن اسکریپت متریکس به وبسایت خود نیازمند تعریف یک Tag هستید. به همین منظور با زدن بر روی آیکون سه نقطه بر روی فولدر گزینهی Add New Tag را انتخاب نمایید.
در پنجرهی باز شده دو بخش با نامهای
Tag Configuration
و
Triggering
وجود دارد که در بخش
Tag Configuration
کدهای جاوااسکریپتی مربوط به SDK را پیادهسازی خواهیم کرد.
با زدن روی این بخش پنجرهای جدید باز خواهد شد که در آن نوع Tag را
Custom HTML
انتخاب خواهیم کرد.
با انتخاب این گزینه Google Tag Manager محیطی برای پیادهسازی کدهای HTML و Javascript در اختیار ما قرار میدهد.
برای اضافه کردن اسکریپت متریکس در ابتدا خط زیر را داخل این محیط اضافه میکنیم.
<script src="https://cdn.metrix.ir/sdk/web/metrix.umd-2.3.0.js"></script>
برای شروع به کار SDK متریکس داخل scriptای مجزا، SDK را init میکنیم.
<script>
var config = {} // Change and config based on your needs
Metrix.init('YOUR_APP_ID', 'YOUR_API_KEY', config);
</script>
برای اجرا شدن این اسکریپت نیازمند تعریف یک Trigger نیز برای آن هستیم. لذا با کلیک کردن بر روی بخش Triggering میتوان یک Trigger از پیش ساختهشده برای آن انتخاب کرده یا اقدام به تعریف یک Trigger جدید کنیم. در صورت نیاز به تعریف Trigger جدید با زدن روی آیکون + با پنجرهی زیر مواجه شده و میتوان Trigger جدید تعریف نمود.
Google Tag Manager بصورت پیشفرض تعدادی Trigger Type درون خود تعریف کرده است. بطور مثال میتوان با انتخاب Page View از تایپ Page View ، اجرا شدن این تریگر را روی ویو کردن تمامی صفحات گذاشته یا از طریق Trigger Configuration با اعمال فیلتر، روی صفحات خاص اعمال کنیم.
با Save نمودن این Trigger جدید، بعنوان Triggering تگ تعریف شده انتخاب میشود.
شناساندن کاربر به متریکس
طبق این بخش از داکیومنت وب، برای شناسایی کاربری که در حال استفاده از وبسایت شماست توسط متریکس، نیاز است آن را authorize کنید. به همین منظور نیاز به پیادهسازی این قسمت درون یک Tag و وابسته کردن آن به یک Trigger هستید. باید توجه داشت که این Trigger باید زمانی باشد که شما به اطلاعات کاربر خود دسترسی داشته باشید. بنابراین Trigger را طوری تعریف کنید که این اطلاعات در دسترس شما باشد. بطور مثال این Tag میتواند به شکل زیر باشد.
<script>
if (##USER_INFO_IS_PRESENT##) { // Check user info is present
Metrix.authorizeUser(##USERNAME_OF_USER##); // Authorize user with its username
}
</script>
deauthorize
ارسال رخداد کاربران
طبق این بخش از داکیومنت وب برای ارسال ایونت و رخدادهای کاربران نیازمند تعریف یک Tag جدید همانطور که در قسمتهای پیشین بیان شد هستید. برای ارسال ایونت بسته به نیازمندی خود باید Trigger مورد نظر خود را تعریف کنید. Tag مورد نظر برای ارسال ایونت میتواند به صورت زیر باشد:
<script>
var customAttributes = {} // Change based on your custom attributes.
Metrix.newEvent("YOUR_EVENT_SLUG", customAttributes);
</script>
به طور مثال این ایونت میتواند روی کلیک بر روی یک المان با ID مشخص ارسال شود؛ بنابراین Trigger Type این Tag را باید از نوع Click تعریف کرده و در صورت نیاز فیلترهای خود را روی آن اعمال کنید.
یا در مثالی دیگر در صورت View کردن یک Page مشخص نیاز به ارسال ایونت دارید که در این صورت باید Trigger Type را از نوع Page View تعریف نمایید.
فعالسازی webpush
همانند این بخش از داکیومنت وب، بسته به روش مورد نظر برای دریافت اجازه پوش از کاربر ممکن است نیازمند تعریف Tag و Trigger جدید یا تغییر تنظیمات Config هنگام init کردن SDK باشید.
بازگرداندن کاربر به حالت ناشناس
زمانی که کاربر شما از وبسایت شما Logout میکند باید آن را به حالت ناشناس بازگردانید بنابراین میتوانید با تعریف یک Trigger روی دکمهی Logout و متصل کردن آن به یک تگ حاوی اسکریپت زیر کاربر را به حالت ناشناس بازگردانید.
<script>
Metrix.deauthorizeUser()
</script>
منتشر کردن تغییرات
پس از آنکه تمامی Tagها و Triggerهای مورد نیاز خود را تعریف کرده و از درستی آن اطمینان حاصل کردید برای در دسترس قرار گرفتن این تغییرات روی محیط Production باید این تغییرات را Publish کنید. بنابراین با زدن روی دکمهی Submit با پنجرهی زیر روبرو خواهید شد:
با پرکردن فیلد Version Name یک عنوان برای تغییرات خود وارد کرده و در انتها دکمهی Publish را بزنید. پس از چند دقیقه تغییرات شما روی وبسایت شما در دسترس خواهد بود.