يعمل “وضع المعاينة” ال “Preview mode ” في جوجل تاج منجر على المعاينة والتحقق من جميع التعديلات التي نقوم بها في جوجل تاج منجر عند تثبيت مختلف البيكسلات الخاصة بالأدوات التسويقية, وقد كان يسمى في بادئ الأمر ب”وضع المعاينة” “preview mode ” وقام جوجل باعادة تسميته ل tag assistant
هذا الاسم الجدبد لميزة وضع المعاينة” tag assistant مشابه لاضافة “extension” في متصفح كروم خاصة بالتحقق من صحة نشر الأكواد والبكسلات المتعلقة بأدوات جوجل التسويقية فقط, وتجدر الاشارة على أنه لايوجد صلة بين هذين الأذاتين ,الأذاتين مختلفتين كليا , هذا التشابه في التسميات فقط
نقوم بنشر بعض الاعدادات في أداة جوجل تاج منجر على اعتبار أننا قمنا بها بالشكل الصحيح لكن يظهر لاحقا ان هنالك بعض الاخطاء التي قمنا بها,يمكننا هذا الوضع من رؤية والتحقق من قيامنا بنشرالاعدادات في الأداة بشكل صحيح ,ويمكننا من تلافي مشكل ارسال بيانات غير كاملة أو حتى خاظئة للأدوات التسويقية
ويتيح لنا وضع المعاينه في جوجل تاج منجر مراقبة أي من الاعدادات تحديدا التي قمنا باعدادها بشكل خاطىئ لنقوم باصلاحها قبل اعتمادها بشكل نهائي في الموقع ولكل الزوار
ويمكننا ال “tag assistant”من الاجابه عن بعض الاسئله المهمه التي تمكننا من معرفة مدى نجاحنا في تفعييل الاعدادات بطريقة صحيحة في جوجل تاج منجر كمثال يكمننا وضع المعاينة من معرفه سبب عدم تفعييل أحد البيكسلات في الموقع , ويتيح لنا كذلك معرفه البيانات التي نتوفر عليها في جوجل تاج منجرعندما يتم تسجييل أحد تفاعلات الزوار,وأي من المتغيرات يمكننا اعتمادها لتفعييل مختلف التاجات والترغرز
فوائد استخدام وضع المعاينة في جوجل تاج منجر
كما أشرنا يمكننا معرفة الtags التي يتم تفعييلها “تقوم بعمل firing” والتي لاتعمل firing” , بمعنى أي من الأكواد تقوم بارسال البيانات للأدوات التسويقية عطفا على التفاعلات التي نحددها , وهل يتم تسجيل وارسال البيانات عند وقوع الحدث ” الذي من المفترض عند حدوثه ارسال هذه البيانات
سنأخد مثال لنفهم هذه الميزة أكثر,نفترض مثلا أننا نرغب في ارسال event “حدث” الى جوجل أنالتكس 4 عندما يقوم الزائر بملأ استمارة في الموقع , لاعداد وارسال هذا الحدث في جوجل تاج منجر سنحتاج لانشاء tag خاص بالأداة التي سنرسل البيانات لها ,في هذا المثال جوجل أنالتكس 4 , ثم سنقوم بانشاء الtrigger الذي سيحدد متى سترسل هذه البيانات (التفاعل الذي يجب أن يحدث في الموقع ) , الاشكال هنا انه في بعض الأحيان لايكون ال url فريد بشكل كاف من أجل أن يتم تحديده كشرط “condition” لعمل firing لهذا الtag , سيتغير هذا الurl في حالة اذا قمنا بارسال بيانات صحيحة وكذلك اذا قمنا بادخال أحد حقول الاستمارة بشكل خاطئ ,في هذا المثال سنرغب بارسال حدث لجوجل أنالتكس فقط اذا تم ملأ هذه الاستمارة بنجاح , سيتيح لنا وضع المعاينة في جوجل تاج منجر التأكد من نجاحنا أو خطئنا في اعداد هذه الاعدادات بالشكل الصحيح قبل نشر هذه التغييرات في أداة جوجل تاج منجر,حيث سنقوم بتفعيل وضع المعاينة في جوجل تاج منجر(شاهد الصورة بالاسفل ) وسنقوم بالذهاب لموقعنا الالكتروني ونملأ هذه الاستمارة بنجاح ثم نختار في وضع المعاينة في تبويب ال “event stream ” الحدث pageview ” والدي يمثل ال trigger أي التفاعل الذي يجب أن يحدث من أجل ان يتم عمل firing لtag ,الان وبعد اختيارنا لtrigger “مشاهدة صفحة “pageview” سنذهب لتبويب “المتغيرات variables “وستشاهد “القيمة value ” الخاص بهذا الvariable والذي سيحدد القيمة التي يجب أن يتضمنها الvariable من أجل أن تتم عملية ارسال حدث “event” ملأ الاستمارة بنجاح ,لأنه في حالة قمنا بملأ هذه الاستمارة بشكل خاطئ ستتغير القيم الخاصة بالمتغير” variable” واذا تغيرت قيمة هذا الvariable لن يقوم tag الخاص بجوجل أنالتكس ب firing ,فقط من خلال وضع المعاينة في جوجل تاج منجر سنتتمكن من معرفة السبب وراء نجاح أو فشل هذه الtags في الfiring
طريقة عمل أداة ال preview mode في جوجل تاج منجر
لمعاينة التغييرات التي نقوم بها في وضع المعاينة “preview mode ” سندخل لجوجل تاج منجر”طبعا نحتاج لتوفر حساب في الأداة وكذلك تثبيت مايعرف بالحاوية الcontainer ” في كود الموقع
قبل تفعييل وضع المعاينة يجب علينا أن نتوفر على حساب في أداة جوجل تاج منجر وكذلك تثبيت مايعرف بالحاوية ال”container ” بعد ذلك سنقوم بالدخول لموقع tagmanager.google.com ,ثم سنقوم بالضغط على preview حيث سنقوم بربط صفحة الموقع المراد معاينتها مع وضع المعاينة
نقوم بادخال أحد صفحات الموقع المراد معاينتها ونضغط على connect
ستضهر هذه الشاشة التي تخبرنا بنجاح أو فشل عملية الربط بين وضع المعاينة “tag assistant” وموقعنا الالكتروني , في حالة نجاح عملية الربط سيفيدنا بنجاح الاتصال Connected , وفي حالة الفشل في الاتصال سيفيدنا بفشل الاتصال not connected (هنالك بعض الأسباب لفشل اتصال وضع المعاينة في جوجل تاج منجر بموقعنا الالكتروني وقد قمت بشرحها في هذا المقال ) بعد نجاح الاتصال ستضهر هذه الشاشة في الأسفل والتي تفيد بنجاح الاتصال ,وسيتم كذلك فتح صفحة الويب المراد معاينتها ويمكننا ملاحضة عنوان هذه الصفحة حيث يضهر عنوان الصفحة والذي يحتوي على بيانات اضافية عبارة عن query parameters , وتعتبربمثابة اخطار من وضع المعاينة لصفحة موقعنا أن التفاعلات التي تحدث قي هذه الصفحة التي يحتوي عنوانها على هذه الباراميترز يجب أن يتم ارسالها لوضع المعاينة, ويضهر كذلك banner في صفحة الموقع يحتوي على رسالة تفيد أن معلومات وضع المعاينة لهذه الصفخة تضهر في نافذة ال tag assistant “
حيث ستضهر تحديدا في تبويب باسم summary ويحدد الخط الزمني للأحداث ” وهو بمثابة “Trigger”checkpoint للأحداث والتفاعلات, حيث يقوم هذا الtrigger بعمل تقييم بموجبه سيحدد هل يتوجب عمل firing ل tag معين أو ينتضر حتى حدوث تفاعل معين
ويعرض هذا الخط الزمني أو ال”event stream” أو “event timeline” جميع الأحداث التي تحدث في الموقع وتحديدا في طبقة البيانات (شاهد هذه المقالة لتعرف أكثر عن طبقة البيانات) مثل مشاهدات الصفحة وعمليات إرسال النماذج والنقرات وما إلى ذلك). النقطة التي أرغب في التشديد عليها أن مفهوم الأحداث في جوجل تاج منجر وجوجل أنالتكس مختلف كليا , ووجه الشبه الوحيد بينهما هو تسمية “حدث”. هذان مفهومان مختلفان تمامًا ، وقد أوضحت الاختلافات بينهما في هذا المنشور .
يتم عرض جميع الأحداث التي تحدث في موقعنا في طبقة البيانات على الجانب الأيسر من نافذة المعاينة والتصحيح . في كل مرة يتم فيها تحميل الصفحة المراد معاينتها ، ستضهر ثلاث أحداث بشكل افتراضي ,وهي container Loaded و DOM READY و window loaded , وتمثل هذه الأحداث المرحلة التي تصل لها صفحة ويب عندما يتم تحميلها , فعندما يقوم متصفح معين بعرض الصفحة يبدأ بتحمييل مكوناتها ,بحيث يسجل الحدث الأول المسمى container loaded والذي كان يسمى سابقا ب page view ونستخدم هذا الحدث ك trigger عندما نرغب بعمل firing ل tag معين يستلزم تفعييله وصول تحمييل الصفحة للمرحلة الأولى من تحميل الصفحة, يستلزم هذا الtag أن يتم تحميل هيكل الصفحة فقط ,ويتم كذلك تحميل الحاوية أو” الكنتينر” container الخاص بجوجل تاج منجر, الحدث الثاني وهو dom ready , يظهر حدث DOM Ready في وضع المعاينة وفي طبقة البيانات عندما ينتهي المتصفح من إنشاء مايعرف ب “الدوم” ولتبسيط معنى وكيفية استخدامه ك trigger في جوجل تاج منجر فيمثل ببساطة الحدث الذي يحدد وقت انتهاء المتصفح من تحميل مكونات الصفحة حيث عند وصول وقت تحميل الصفحة لهذا الحدث سيكون بامكاننا استخدام البيانات والقيم الخاصة بهذه الصفحة التي تم الانتهاء من تحميلها ,وأحد الاستثنائات هو أدوات الأطراف التالثة “Third party tools ” المدمجة في الموقع ,
وعندما يتم تسجيل هذا الحدث يمكننا ارسال مختلف القيم والبيانات الخاصة بصفحة ويب لأدوات التسويق الالكتروني باستخدام تقنية ال “Dom scraping
والحدث الثالث الافتراضي يسمى window loaded : ويظهر في وضع المعاينة (وفي طبقة البيانات) عندما يتم تحميل الصفحة وجميع عناصرها بالكامل ، بما في ذلك جميع السكربتات الخاصة بالجهات الثالثة “كمثال الودجات الخاصة بالدردشة” بمعنى آخر في هذا المثال اذا رغبنا في تتبع أحد تفاعلات زوار موقعنا مع ويدجت خاص بالدردشة وارسال هذا التفاعل كحدث لأداة خاصة بالتحليل كجوجل أنالتكس 4 يتوجب علينا من أجل أن يتم تفعييل هذا الtag أن نختار window loaded ك “trigger”،
يوجد كذلك تبويب الvariables “المتغيرات” وهو عباره عن قيم” attributes” تقوم بفلترة التفاعلات triggers“التي يقوم بها زائر معين عند تفاعله مع احد عناصر صفحه ويب في الموقع (عند الحديث عن وضع المعاينة ليس الزائر من يقوم بالتفاعل بل نحن أصحاب الموقع و حساب جوجل تاج منجر ) , حيث تقوم بتحديد أحد خصائص ال triggers
وتضهر كذلك الdata layer “طبقة البيانات “للتعمق أكثر وفهم “طبقة البيانات” أحد أهم مكونات جوجل تاج منجر شاهد هذا المقال “
وتضهر كل من” التاجات” التي قامت بالfiring تحت اسم Tags Fired (شاهد الصورة أسفل) و”التاجات” التي لم تقم بالfiring تحت اسم tags not fired ,
يقوم جوجل تاج منجر باضهار التفاعلات التي تحدث في موقع الكتروني تم تفعيل وضع المعاينة به على شكل أحداث وقد تحدثنا عن الأحداث الثلاث الافتراضية التي يضهرها جوجل تاج منجر preview mode في شريط الأحداث “event stream” , وتضهر أحداث أخرى في شريط الأحداث عطفا على التفاعلات التي نقوم بها في الموقع , نذكر من بينها الضغط على أحد اللينكات , ملأ استمارة , عمل scroll و أحداث وتفاعلات اخرى تعتمد على الوقت الذي يقضيه الزائر لاكمال تفاعل معين في الصفحة وكذلك أحداث يقوم بها الزائرفي صفحة معينة والتي لاينتج عنها اعادة تحميل الصفحة أو توجيه الزائر لصفحة أخرى يسمى ب الhistory change ,ويتم استخدام هذا النوع من التفاعل ك “trigger” لتتبع مواقع الصفحة الواحدة single page application شاهد هذا المقال لتعرف أكثر) وكذلك الأحداث التي تؤدي لأخطاء في الجافاسكربت (يمكننا اعداد أخطاء الجافاسكربت كأحداث في جوجل انالتكس 4 على سبيل المثال ), وتجدر الاشارة أن هنالك أنواع أخرى من الأحداث لايقوم جوجل تاج منجر بتتبعها بمعنى أنه لايوجد أي trigger يتم تسجيله في شريط الأحداث في هذه الحالة يتوجب علينا اخطار جوجل تاج منجر بحدوث هذا التفاعل حيث سيقوم جوجل تاج منجر بدوره بتسجيله في شريط الأحداث وحينها يمكننا استخدامه ك trigger لعمل firing ل التاجات الخاصة بمختلف الأدوات التسويقية (طبعا التي لايمكن تتبعها بما سبق من triggers ) حيث يلزمنا استخدام مايعرف ب Custom event من أجل أن يقوم بتسجيلها في شريط الأحداث في وضع المعاينة في جوجل تاج منجر
تبويب ال tag : عند الضغط عليه يعرض جميع العلامات ال tags المتاحة مقسمة إلى مجموعتين: تلك التي تم تنشيطها أو تفعيلها (عمل firing لها) عند حدوث الحدث المحدد , وتلك التي لم يتم تنشيطها. ما يجعل هذا القسم رائعًا حقًا ، هو أنه يعطينا القدرة على معرفة السبب الدقيق وراء تنشيط علامة “tag معين” أو عدم تنشيطها, يمكننا اختيار أي حدث في المخطط الزمني للأحدث ثم انقر على العلامة التي تهتم بها
ما ستراه هو عرض أكثر تفصيلاً لخصائص هذا التاج أولا يضهر نوع هذا التاج في مثالنا هذا الوسم الخاص بتتبع جميع صفحات الموقع ال “configuration tag” الخاص جوجل أنالتكس 4 . ثم firing status وتمثل وضعية التاج بمعنى هل تم تفعيل التاج أو لا , اذا تم تفعيل التاج ستساوي قيمة التفعيل succeeded واذا لم يتم تفعييله ستساوي القيمة Not fired .
إذا كنت تستخدم Triggers أكثر تعقيدًا مع عدة شروط “لتفعيل الtag ” ، يمكنك رؤية حالة كل منها . يشير مربع الاختيار الأخضر إلى أنه تم استيفاء الشرط ، وإذا لم يتم استيفاء الشرط “الtrigger” ستضهر علامة X باللون الأحمر.
كيفية مشاركة وضع المعاينة مع مستخدميين اخريين
لمشاركة وضع المعاينة مع شخص ما ، أولاً ، تحتاج إلى تفعييل وضع المعاينة ، ثم في الزاوية اليمنى العليا ، نقوم بالنقر فوق الثلاث نقاط > ثم “share” مشاركة
ثم ستظهر نافذة منبثقة حيث يتعين علينا :
أولا : ادخال رابط موقعنا الالكتروني حيث نريد تفعييل وضع المعاينة
ثانيا : تحديد الحاوية “ال container رقم أو رمز الشفرة البرمجية التي قمت بتثبييتها في موقعك (إذا كان هناك العديد من حاويات GTM أو GTAG تأكد من اختيار الحاوية الصحيحة المثبتة في الموقع المراد مشاركة وضع المعاينة به ) . هام: يجب تحديد حاوية GTM في القائمة المنسدلة (شاهد الصورة) , ثم نقوم بنسخ الرابط وشاركه مع الشخص الدي تريده
كيفيه انهاء وضع المعاينه في جوجل تاج منجر
إذا كنت ترغب في الخروج من وضع المعاينة ، فإن أفضل طريقة هي النقر على انهاء finish في شارة وضع المعاينة (التي يتم عرضها في الركن الأيمن السفلي من موقع الويب الخاص بك).
