خدمة Google Tag Manager ما هي ؟ ما الهدف منها ؟ و كيف تبدأ العمل بها .
تملك موقع تسويقي هل ترغب في مراقبة وقياس أداء موقعك على الويب ومنتجاتك وحملاتك التسويقية بفعالية؟ ألا ترغب في معرفة المزيد عن كيفية حركة التسوق للزائرين؟ تعرف على ماذا ينقرون؟ لديك موقع أو مدونة أليس من المحبط عدم الحصول على معلومات حول ما يفعله الزوار على موقعك ؟ إذا أنت بحاجة لإستعمال العديد من الخدمات و التي غالبا ما تطلب منك حقن كود التتبع الخاص بها بالموقع على سبيل الذكر : Google Analytics . Google Search Console . حملات Google AdWords . ربط مواقع التواصل الإجتماعي : Facebook او Twitter او Pinterest .
توفر لنا جوجل العديد من المزايا و الخدمات لتقديم كل التسهيلات للمستخدم، و تحاول دائما توفير منصات جاهزة بترسانة من الوسائل المستخدمة و التي من خلالها تستطيع التحكم و تسير كل ما يخص موقعك أو مدونتك . في هذا المقال، سنراجع معك احد اهم المنصات القوية التي توفرها لنا Google، و التي على كل مبرمج أو صاحب موقع ان يطلع عليها، بل و إستخدامها في برمجياته على الويب، لأن وظيفة هذه المنصة مهمة للغاية . خدمة Google Tag Manager
خدمة Google Tag Manager المختصرة بـــ GTM تسهل للأصحاب و مبرمجي المواقع عملية إضافة و إدارة الـ Tags الخاصة بالمواقعهم ، بحيث يتمكن مسؤول الإدارة للموقع من إدارة كل الـ Tags من مكان واحد مما يسهل عملية التحرير و التعديل مع إمكانية إضافة الـ Tags لصفحات معينة من الموقع ، فما المقصود بالـ Tags ؟ و كيف تستفيد من هذه الخدمة GTM ؟ تابع قراءة المقال التالي الذي سنشرح فيه تفاصيل هذه الخدمة ، أتمنى لك قرائة ممتعة و الفائدة للجميع . شرح خدمة Google Tag Manager
ما هو الـ Tag بالمفهوم المبسط .
المقصود بالـ Tag هو كود برمجي صغير من خلاله تسمح أو تعطي الصلاحية للخدمة المانحة لهذا الكود إمكانية التتبع و التحليل أو الربط بينها و بين موقعك . حيث تستطيع إضافته إلى كل صفحات موقعك أو تحديد صفحة من الصفحات .على سبيل المثال قد تحتاج لإضافة Tag لمتابعة عدد الزوار ، عدد النقرات ، معدل التحويل ، و غيرها من الأمور التي يحتاج أصحاب المواقع إلى تحليلها و دراستها ، لعل أشهر مثال على الـ tags هو الـ Tags الخاص بـ google Analytics و Google Search Console . أو ربط الموقع بـ Twitter او Pinterest او حتى Facebook . شرح خدمة Google Tag Manager
لماذا نحن بحاجة لـهذه الخدمة Google Tag Manager
حين تضيف اي خدمة من الخدمات و تحاول ربطها بالموقع ، تقدم لك هذه الخدمات كود التتبع الخاص بها (Meta) لتضيفه في محرر الأكواد الخاص بموقعك . هنا تكمن المشكلة في كثرة الأكواد و Tags حينها ستتداخل الأمور و لن تصبح قادراً إدارتها . لن تتذكر أي صفحة تستخدم هذا الـ Tag و أي صفحة لا تستخدمه، ثم ثانيا سيستطيع أي احد التعرف عليها و إستخراجها أيضا لأغراض شخصية ربما، وتسبب أحيانا الثقل في تحميل الموقع . و نظرا لذلك تأتي خدمة Google Tag Manager لتخليصك من كل هذا، فور التسجيل بالخدمة و إضافة موقعك، سيطلب منك إضافة الكود الخاص بالمنصة من أجل ربطها مع موقعك و التأكد منها، فور فعل ذلك، أنت لست مضطرا بعد الآن لإضافة اي كود او أي Tag في موقعك، يمكنك مباشرة إستخدام عبر منصة Google Tag Manager .
نأتي الآن إلى كيفية أستخدام Google Tag Manager
للبدء باستخدام الخدمة ندخل إلى الرابط التالي ، فتظهر أمامك الصفحة التالية بالصورة :
قم بالضغط على Sign up for free لتظهر أمامك النافذة للتسجيل عبر حسابك بالــ Gmail حدد الحساب المراد العمل به و يستحسن العمل بحساب موحد بين جميع الخدمات ثم تظهر أمامنا الصفحة التالية :شرح خدمة Google Tag Manager
من خلال الضغط على Create an account سنقوم بإنشاء حساب على منصة الخدمة .
- 1 – إدخال اسم اختياري للحساب ، الاسم لعملية الإدارة لا أكثر يمكنك اختيار أي اسم ترغب به .
- 2 – إختيار البلد .
- 3 – نقوم بكتابة رابط الموقع الذي نرغب بإدارة الـ Tags فيه . وبدون البادئة كما بالصورة .
- 4 – اختيار المنصة ويب أم أندرويد أم IOS ام AMP .
- 5 – بعدها نضغط على Create لتظهر امامك الصفحة التالية : اتفاقية شروط خدمة إدارة العلامات من Google
نوافق على شروط الإتفاقية بالضغط على yes ثم ننتظر قليلا . لتضهر هذه النافذة .شرح خدمة Google Tag Manager
لنبدأ بمنصة ووربريس WordPress
- 1 – إذهب إلى المظهر Appearance .
- 2 – ثم محرر القوالب Theme Editor .
- 3 – إبحث عن الملف header.php .
- 4 – مباشرتا أسفل الوسم <head> أضف الكود المتحصل عليه الأول كود الجافاسكربت.
- 5 – الكود المتحصل عليه الأول كود الجافاسكربت.
- 6 – مباشرتا أسفل الوسم </head> أضف الكود المتحصل عليه الثاني كود الربط.
- 7 – الكود المتحصل عليه الثاني كود الربط.
- 8 – حفظ التغيرات ملاحظة : إذا كان فيه هناك مشكلة عند الحفظ . إذهب إلى الــ Cpanel واسمح للكتابة على هذا الملف عبر تغير الأذونات .
الآن منصة بلوجر Blogger
- 1 – إذهب إلى المظهر .
- 2 – ثم التعديل HTML .
- 3 – في مربع البحث إبحث عن الوسم <head> .
- 4 – هذا هو الكود.
- 5 – مباشرتا أسفل الوسم <head> أضف الكود المتحصل عليه الأول كود الجافاسكربت.
- 6 – في مربع البحث إبحث عن الوسم <body> .
- 7 – مباشرتا أسفل الوسم <body> أضف الكود المتحصل عليه الثاني كود الربط.
- 8 – حفظ المظهر .
ملاحظة : عند القيام بحفظ المضهر . سيحدث خطأ أثناء تحليل XML . فقم بتغير الكود كما هو موضح بالصورة . ثم أعد الحفظ من جديد .شرح خدمة Google Tag Manager
الآن و قد تم ربط الخدمة Google Tag Manager بالموقع وللتأكد من عملية الربط . أعد تحميل صفحة الموقع الخاص بك راح تلاحظ وجود أيقونة على هذا الشكل بالأسفل 
أو ستشاهد أن الخدمة أخذت مساحة أسفل الشاشة على هذا الشكل التالي :
لنقم بتجربة لهذه الخدمة Google Tag Manager
قبل متابعة الشرح للعلم فقط انه يجب أن تملك حساب على الخدمة Google Analytics و قد سبق و شرحنا هذه الخدمة بهذه المقالة . ستتحصل على كود التتبع الخاص بالخدمة Google Analytics و الذي من خلالة سنقوم بربط الحدث الذي نحن بصدد إنشائه لتتبع مجريات النقر على الحدث . تابع هذه المقالة لتعرف إلى كيفية ربط موقعك بخدمة Google Analytics
بالأعلى بالموقع لدينا شريط أفقي لأقسام الموقع . نريد الآن إنشاء حدث تتبع للنقر على القسم تطوير المواقع . لمعرفة مدى فعالية هذا القسم و هل الزائر يقوم بالنقر على هذه الايقونة و ما نسبة النقر عليها .
على يمين الشاشة نضغط على Tags ثم لإضافة حدث جديد نضغط على New .
الآن نختار الخدمة المراد إستعمالها . كما ترون على يسار الشاشة هنالك العديد من الخدمات و التي بإستطاعتك ربطها بالموقع فقط من خلال إستعمال خدمة Google Tag Manager . التي بدورها ستغنيك عن الدخول في مشاكل إضافة الأكواد كما سبق و شرحنا . المهم بالنسبة لنا الآن هو Google Analytics: Universal Analytics نضغط على هذه الخدمة .شرح خدمة Google Tag Manager
هنا الضغط على Triggering لإضافة الحدث . هنالك الكثير من الاحداث عن طريق أيقونة + الموجودة بالأعلى على اليسار ثم Trigger Configuration نختار All Elements . إضغط على الصورة للتكبير
- 1 – ترك هذا الخيار على Event الهدف .
- 2 – هنا قم بتسمية الفئة على سبيل المثال Click النقر .
- 3 – قم بتسمية الحدث لنسميه مثلا أقسام الموقع Site Sections .
- 4 – ضع علامة لتمكين الإعدادات .
- 5 – ضع كود التتبع الخاص بموقعك على خدمة Google Analytics .
إضغط على الصورة للتكبير
- 1 – إختر Click text للأننا سنضيف النص المرار تتبع النقر عليه .
- 2 – أكتب النص هنا بدون خطأ .
- 3 – حفظ التعديل .
راح يطلب منك تسمية الحدث سميه مثل ما شأت لنسميه مثلا : تطوير المواقع . ثم حفظ مرة ثانية سيطلب منك تسمية الخدمة سمها مثلا : Google Analytics ثم حفظ . ثم من خلال صفحة الخدمة إضغط على Refresh كما هو موضح بالصورة .
الآن و قد تم إنشاء الحدث الخاص بتتبع النقر على تطوير المواقع راح إنجرب . إفتح حسابك على خدمة Google Analytics .
اترك صفحة Google Analytics الآن و إذهب إلى إعادة تحميل صفحة الموقع . ثم أنقر على الكلمة او النص او العنوان المقصود للتتبع و الذي هو تطوير المواقع في مثالنا هذا . أنقر مرة أو مرتين . و شاهد أمامك بالمربع المشار إليه بالصورة كيفية تفاعل الحدث مع عملية النقر .
إرجع مرة أخرى إلى صفحة Google Analytics و لاحظ أنه تم تسجيل نقرتين على الحدث . و بذلك من الآن تستطيع تتبع كل النقرات على هذا النص . مثل هكذا أحداث تكون جد نافعة بالنسبة للذين يملكون مواقع التسوق عبر النت . يستطعون معرفة ما هي المنتجات الاكثر إقبالا من طرف الزائر .
على العموم من خلال هذه المقالة أردت فقط إعطاء لمحة بسيطة على قدرات و منافع هذه الخدمة العملاقة المقدمة من طرف مطوري Google . الخدمة تحتوي على العديد من الميزات والتي تجعلنا لا نستغي عنها . وخاصتا في تنظيم الأكواد مع سهولة تركيبها على الموقع . الخدمة تعطيك إمكانية ربط موقعك مع العديد من الخدمات . بالتوفيق للجميع .
بارك الله فيك ❤
شكرا أخي . وإنشاء الله كان المقال مفيد . بالتوفيق حبيبي