در ادامه مبحث جلسه گذشته، در این جلسه قصد داریم تا به توضیح ایجاد متغییر های دلخواه در درون ابزار گوگل تگ منیجر بپردازیم. در جلسه قبل دانستیم که متغییر ها چیست و چه نقشی در ابزار گوگل دارد. متغییرها به عنوان پایه ای ترین و یا به عبارتی اصلی ترین قسمت ابزار google tag manager شناخته می شود و برای ساخت یک manager حتما می بایست از Variables استفاده کنیم. متغییرها به صورت های پیشفرض و دلخواه در درون کنسول گوگل قابل استفاده است که در جلسه قبل متغییر های پیش فرض را معرفی کردیم. حالا در این جلسه می خواهیم با متغییرهای دلخواه که در باکس دوم از قسمت Variables وجود دارد آشنا شویم.
در صفحه اصلی ابزار گوگل تگ منیجر، در سایدبار سمت چپ بر روی قسمت Variables کلیلک کنید. در صفحه باز شده دو تا باکس قابل مشاهده است. ما با باکس دوم User defined variable در این جلسه کار داریم در شکل زیر این باکس را مشاهده می کنید.
همانطور که می بینید تاکنون هیچ متغییری برای این مخزن، تعریف نشده است برای ایجاد متغییر بر روی دکمه New قسمت بالا سمت راست کلیک کنید. با کلیلک کردن بر روی این دکمه کنسولی به شکل زیر در سمت راست صفحه ظاهر می شود.
در این قسمت دو گزینه قابل توضیح وجود دارد. یکی قسمت Untitled Variables در بالا سمت چپ پنجره که می بایست نام متغییر را در آن ضبط کنیم، و یکی باکس Variable Configuration که جدولی از متغییر های ایجاد شده است. در این جلسه تمام تمرکز ما بر روی این قسمت است. با کلیلک بر روی این باکس منویی از سمت راست باز می شود.
نکته: گوگل برای ایجاد متغییرهای دلخواه ما را تنها نگذاشته است و 20 راهکار مختلف را برای ایجاد متغییر دلخواه برای آسانی کار ما در نظر گرفته است. اما این تمام ماجرا نیست. یک سری متغییر های دیگری نیز کاربران ایجاد کرده اند و در مخزن گوگل ثبت کرده اند که می توانید از این متغییرها نیز استفاده کنید. اما گوگل هشدار می دهد که در استفاده از این موارد تمام دقت را داشته باشید چون این متغییر ها توسط گوگل تائید نشده اند.
در منوی جدید باز شده variables configuration دو قسمت وجود دارد یکی قسمت Discover more variable types in the Community Template Gallery که با مراجعه به آن می توانید متغییرهای بیشتری را که کاربران ایجاد نموده اند را مشاهده کنید. در قسمت زیرین مجموعه ای از تمامی متغییر هایی که گوگل به صورت پیشفرض در دسترس قرار داده است را مشاهده می کنید. در ادامه به توضیح هر کدام از این متغییرها می پردازیم:
- HTTP Referrer: با استفاده از این قسمت می توانید بر روی المان های صفحات refer شده از صفحه قبل بر روی هدر Html کار کنید. در بین Component Type ها می توانید مورد استفاده را انتخاب کنید.
- URL: با استفاده از این خصیصه می توانید مقادیر URL صفحه را در درون متغییر های پیشفرض خود دریافت کنید.
- 1st Party cookie: با استفاده ازاین قسمت می توانید مقادیر کوکی درجه یک صفحه را براساس نام آن در درون متغییر دلخواه خود دریافت کنید.
- Custom Javascript: این ویژگی نیز کاملا خودش را تعریف می کند. اگر دانش استفاده از جاوا اسکریپت را دارید می توانید با استفاده از این قسمت متغییرها و کدهای جاوا اسکریپت خودتون رو مورد استفاده قرار دهید.
- Data Layer Variable: با استفاده از این قسمت می توانید به متغییر های سطح پائین data Layer در گوگل تگ منیجر دسترسی داشته باشید.
- Javascript Variable: با استفاده از قسمت می توانید یک متغییر پیشفرض گوگل تگ منیجر را به صورت جاوا اسکریپت تعریف کنید.
- Auto-Event Variable: با استفاده از این قسمت می توانید مقادیر مختلف event هائی که در درون تگ منیجر اتفاق می افتد را گرفته و در درون متغییر های خود قرار دهید.
- DOM Element: با استفاده از این المان می توانید با توجه به کلاس و یا ای دی یک DOM در رون کدهای Html متغیر را تعریف کنید.
- Element Visibility: براساس پیدا و یا پنهان بودن المان برحسب درصد بر روی صفحه کاربر مقادیری را در متغییر قرار می دهد.
- Constant: مقدار ثابتی را به عنوان متغییر در درون ابزار گوگل تگ منیجر تعریف می کند.
- Custom Event: با استفاده از این قسمت می توانید یک Event دلخواه را در درون صفحه خود با استفاده از Data Layer اجرا کنید.
- Environment Name: با استفاده از این قسمت می توانید ارزش نام Environment را در درون یک متغییر قرار دهید.
- Google Analytics settings: با استفاده از این قسمت می توانید از امکانات گوگل آنالیتکس به عنوان یک متغییر در درون تگ منیجر استاده برید.
- Lookup Table: این مورد دقیقا در علم موردی جا افتاده است. با استفاده از این ویژگی می توانید جدولی از اطلاعات را جهت مقایسه به وجود آورید. در صورت عدم تطابق مقدار Undefined در درون متغییر قرار می گیرد.
- Random Number: یک عدد تصادفی را می توانید بر روی Variable خود دریافت کنید.
- RegEx Table: در واقع این قسمت تکمیل کننده قابلیت Lookup Table است. در متغییر Lookup Table نمی توانستیم به صورت عبارت های با قاعده به جست و جوی عبارت بپردازیم ولی در این قسمت می توانیم جدولی با استفاده از RegEx برای آن ها بسازیم.
- Undefined Value: یک عبارت Undefined جاوا اسکریپت را بر می گرداند.
- Container ID: با استفاده از این متغییر می توانید ای دی مخزن فعال google tag manager را دریافت کنید.
- Container Version Name: با استفاده از این قسمت می توانید نام مخزن فعال در تگ منیجر را در متغییر بر گردانید.
- Debug Mode: مقدار true و یا false را برای حالت debugging mode ابزار به صورت یک متغییر بر می گرداند.
تا این جا با ویژگی هایی که در درون متغییر های دلخواه می توانیم استفاده کنیم آشنا شدیم. در ادامه می خواهیم با توجه به دانشی که کسب کرده ایم متغییری را ایجاد نمائیم. ایجاد یک متغییر اصلا کار پیچیده ای نیست و تنها به تمرین و پشتکار زیاد نیاز دارد.
نکته: در هنگام ایجاد هر متغییر در کنسول قسمتی به نام Format Value وجود دارد. در واقع کارایی این قسمت به این صورت است که می توانید مدیریت بیشتری بر روی خروجی های متغییر خود (Format) داشته باشید و خروجی های آن متغییر را در شرایط خاص به موارد دیگر تبدیل کنید. به عنوان مثال اگر می خواهید تمامی حروف بزرگ را به صورت حروف کوچک نمایش دهید می توانید از Change case to استفاده کنید. یا بقیه موارد که کار کردهای مختلفی دارند و می توانید از آن ها استفاده کنید.
نکته: سوالی که ممکن است برای شما نیز پیش آمده باشد این است که در برنامه نویسی ها ما می توانیم در درون یک متغییر از متغییرهای دیگر استفاده کنیم. پس چرا در اینجا چرا این چنین قابلیتی وجود ندارد. باید گفت که در اینجا نیز این چنین قابلیتی تعریف شده است با این تفاوت که تنها بعضی از متغییر ها بر حسب شرایط قابلیت تعریف تو در تو را دارند. در مثال این قسمت از یکی از متغیرهای تو در تو استفاده می کنیم.
نحوه ایجاد یک متغییر در گوگل تگ منیجر:
ابتدا مراحل قسمت قبل را جهت ایجاد یک variable طی می کنیم. در قسمت Choose Variable Type، ما قسمت URL را انتخاب می کنیم. با انتخاب کردن URL باکسی به شکل زیر بر روی صفحه نمایان می شود.
در قسمت component Type موارد زیر، برای ما تعریف شده است:
- Full URL
- Protocol
- Host Name
- Port
- Path
- File Name Extension
- Query
- Fragment
براساس شما نیاز می توانید هر یک از این موارد را که دوست دارید انتخاب کنید. در اینجا ما Host Name را انتخاب می کنیم تا در این متغییر نام دامنه صفحه مورد نظر را دریافت کنیم.
نکته: المان URL براساس وظیفه ای که بر عهده دارد می تواند از قابلیت متغییرهای تو در تو پشتیبانی کند. با انتخاب کردن منوی آبشاری more settings می توانیم متغییر های بیشتری را در درون این متغییر تعریف کنیم.
در این جا ما متغییر URL Source را انتخاب می کنیم. شما بر حسب نیاز هر کدام را که دوست دارید انتخاب کنید و یا حتی یک متغییر دیگر تعریف کنید. قسمت format value نیز برای تغییر قالب متغییر مورد استفاده می گیرد که در بالا به آن در قالب نکته اشاره کردیم.
بعد از ساخت متغییر مد نظر می بایست آن را ذخیره کنیم. جهت ذخیره متغییر، ابتدا لازم است نامی را به این متغییر جهت دسترسی و استفاده از آن اختصاص دهیم. جهت اختصاص نام در قسمت سمت چپ بالای باکس نام مورد نظر را وارد نمائید و سپس در سمت راست بالا بر روی دکمه save کلیک کنید تا متغییر ذخیره گردد.
در اینجا نام URL-Event را جهت ذخیره متغییر نام گذاری کرده ایم. بعد از عملیات ذخیره سازی، متغییر ایجاد شده را در باکس User Defined Variable مثل شکل زیر مشاهده می کنید.
با اتمام این جلسه قسمت آموزش Variables گوگل تگ منیجر به پایان می رسد. و در جلسات آینده به سراغ موارد دیگر این ابزار می رویم. لطفا در جلسات آیند ما را دنبال کنید. در صورت هر گونه سوال در مورد این جلسه می توانید در قسمت نظرات با ما در ارتباط باشید.
جمع بندی:
در این آموزش یاد گرفتیم که به چه شکلی می توانیم متغییرهای دلخواه را در درون گوگل تگ منیجر ایجاد کنیم. کلیه گزینه های پیشفرض موجود در User defined Variables را بررسی کردیم و در انتها یک متغییر URL ساختیم و آن را ذخیره کردیم. با پایان این جلسه ویژگی Variables گوگل تگ منیجر به پایان می رسد و در جلسات آینده قسمت های دیگر را مورد بررسی قرار می دهیم.