تتبع حدث النموذج باستخدام Google Tag Manager

نشرت: 2021-07-19

إذا كنت تبحث عن طريقة سهلة لإعداد تتبع الأحداث لمراقبة التحويلات على موقع الويب الخاص بك ، فقد ترغب في التفكير في استخدام Google Tag Manager.

في هذا المنشور ، سأشرح Google Tag Manager ، وأعلمك بكيفية تثبيته ، وأشرح كيفية إعداد تتبع حدث النموذج على موقعك.

Google Tag Manager GTM V2

ما هو Google Tag Manager؟

يعد Google Tag Manager (GTM) أداة مجانية تسهل على مشرفي المواقع والمسوقين إضافة علامات موقع الويب وتحديثها. هناك العديد من الطرق لاستخدام GTM ، ولكن معظم الشركات تستخدمها لتتبع الأحداث كوسيلة لقياس نجاح استراتيجية التسويق الرقمي الخاصة بهم. للحصول على شرح أكثر تفصيلاً لـ GTM ، تحقق من منشور المدونة التمهيدي الخاص بنا.

لماذا تستخدم GTM لتتبع الأحداث؟

يمنحك GTM التحكم الكامل في علامات الأحداث الخاصة بك. يمكنك إضافتها إلى موقعك دون الحاجة إلى مطالبة المطور الخاص بك بعمل أي ترميز ثابت. سيؤدي ذلك إلى توفير وقتهم للعمل في مشاريع مهمة أخرى.

يسمح لك GTM أيضًا بتعديل واختبار تتبع الأحداث الخاصة بك بنفسك ، مما يجعل العملية أبسط بكثير.

بالإضافة إلى ذلك ، نشهد عددًا متزايدًا من مواقع الويب حيث يتم إنشاء النماذج باستخدام JavaScript. لا تستخدم هذه المواقع عناوين URL المقصودة ، مما يعني أنه لا يمكنك استخدام أهداف بسيطة في Analytics. من أجل إثبات إدارة موقع الويب الخاص بك في المستقبل ، من الجيد التفكير في التعامل مع GTM.

تثبيت GTM

تثبيت GTM مشابه جدًا لإعداد Google Analytics:

  1. قم بتسجيل الدخول إلى Google Tag Manager باستخدام حساب Google الخاص بك - من الناحية المثالية هو نفس الحساب الذي تستخدمه في Analytics. ثم اتبع الخطوات التي تظهر على الشاشة:
    Google Tag Manager إنشاء حساب
    قم بإنشاء حساب على Google Tag Manager

  2. اقرأ ووافق على الشروط والأحكام. ستحصل بعد ذلك على رمز التثبيت. ستحتاج إلى إضافة هذا الرمز إلى كل صفحة من صفحات موقعك ، مباشرة بعد علامة الفتح <body>. إذا لم تتمكن من القيام بذلك بنفسك ، فيجب أن يكون المطور الخاص بك قادرًا على المساعدة:

    كود إدارة العلامات من Google
    الصق رمز GTM في كل صفحة من صفحات موقعك على الويب

هذا هو. لقد أعددت حاوية إدارة العلامات على موقعك. ستحتفظ هذه الحاوية في النهاية بجميع العلامات التي تنشئها في لوحة معلومات GTM.

سأصف الآن كيفية إعداد تتبع الأحداث باستخدام GTM. لهذا ، ستحتاج إلى تمكين العديد من المتغيرات المضمنة داخل الصفحات والنقرات والنماذج. لا يتم تمكينها افتراضيًا عند إعداد GTM. لذلك قبل أن نبدأ ، انتقل إلى المتغيرات وتحقق من الخيارات التالية:

المدمج في إدارة المتغيرات

تتبع حدث النموذج

يسمح لك تتبع إرسال النموذج بمراقبة الوقت الذي يقدم فيه الزوار نموذجًا على موقع الويب الخاص بك. قد يكون هذا نموذج اتصال على صفحة اتصل بنا ، أو نموذج استفسار في تذييل الصفحة. يحتوي كل موقع ويب تقريبًا على نموذج ، لذا فهذه طريقة جيدة للتعامل مع إدارة العلامات.

من السهل نسبيًا إعداد تتبع الأحداث باستخدام GTM ، حيث يمكنك استخدام العلامات المضمنة بالفعل في واجهة GTM. تعد المعرفة الأساسية بشفرة HTML مفيدة ، ولكن هذا الدليل سيشرح كل ما تحتاج إلى معرفته.

لا تقلق ، من المستحيل كسر موقع الويب الخاص بك باستخدام إدارة العلامات ، ويمكنك اختبار كل شيء قبل نشر علاماتك مباشرة.

هيا بنا نقوم بذلك!

الخطوة 1 - تحديد URL

قم بتدوين عنوان URL الموجود على النموذج الخاص بك:

برنامج hallam internet google tag manager

إذا كان لديك نموذج في أكثر من صفحة ، على سبيل المثال نموذج استفسار في التذييل ، فأنت تحتاج فقط إلى معرفة المجال. في هذه الحالة ، نستخدم hallam.co.uk .

الخطوة 2 - تحديد معرف النموذج

ابحث عن معرف النموذج لزر الإرسال. إذا كنت تستخدم Google Chrome أو Firefox ، فيمكنك القيام بذلك من خلال النقر بزر الماوس الأيمن على النموذج وتحديد "فحص العنصر". تحتاج إلى البحث عن سمة "id" في <form>. فيما يلي مثال لما قد يبدو عليه هذا:

معرف النموذج فحص العنصر

نصيحة : يتيح لك الضغط على ctrl + f داخل المفتش البحث عن الأشياء.

ملاحظة : إذا لم يكن هناك معرّف فريد للنموذج الخاص بك ، فقد تحتاج إلى مطالبة المطور الخاص بك بإضافة معرّف. ومع ذلك ، إذا كان موقع الويب الخاص بك يستخدم مكونًا إضافيًا للنموذج مثل نموذج الاتصال 7 لـ WordPress ، فيمكنك إضافة معرف بنفسك.

الخطوة 3 - إنشاء مشغل

في GTM ، أنشئ مشغلًا جديدًا وأعطه عنوانًا يسهل التعرف عليه لاحقًا. شيء مثل "إرسال نموذج الاستفسار" أو "إرسال نموذج صفحة الاتصال" سيفي بالغرض.

ضمن اختيار الحدث ، حدد إرسال النموذج:

نموذج الاستفسار إرسال الزناد

انقر فوق "متابعة" ثم حدد "انتظار العلامات" و "التحقق من التحقق من الصحة" للتأكد من إطلاق المشغل لعمليات إرسال النماذج الناجحة (الصالحة):

التحقق من صحة تتبع حدث عمليات الإرسال

انقر فوق متابعة وأدخل مسار URL الذي سجلته سابقًا:

تمكين عنوان url لصفحة المشغل يحتوي على مسار الصفحة

إذا كان النموذج الخاص بك موجودًا في عدة صفحات ، فيمكنك إعداد المشغل الخاص بك لتنشيط الصفحات التي تحتوي على نطاقك:

تمكين مدير علامات جوجل المشغل

انقر فوق متابعة ثم حدد "بعض النماذج":

إطلاق النار على مشغلات gtm

لإنهاء المشغل ، أضف معرف النموذج الذي سجلته سابقًا (لا تستخدم معرف النموذج الخاص بي!):

إطلاق النار على نموذج تتبع حدث معرف

لقد حددت الآن الشروط التي تتطلبها المشغل لإطلاقه. بعد ذلك ، سنقوم بإنشاء علامة.

الخطوة 4 - إنشاء علامة

أنشئ علامة Universal Analytics جديدة. سترسل هذه العلامة معلومات الحدث إلى Google Analytics. مرة أخرى ، تأكد من إعطائه اسمًا لا يُنسى:

إنشاء علامة حدث تتبع مدير علامات جوجل

أضف معرف تتبع Google Analytics في الحقل التالي:

تكوين العلامة gtm

ثم املأ نوع المسار كحدث ، وحدد معلمات التتبع للفئة والتسمية:

تتبع المعلمات مدير العلامات جوجل

إذا كنت تقوم بإعداد هذا لنموذج موجود في عدة صفحات ، كما هو الحال في هذا المثال ، فانقر فوق المربع الموجود على يمين التسمية وحدد {{مسار الصفحة}} من القائمة المنسدلة. سيضمن ذلك أنه يمكنك معرفة الصفحة التي تم تشغيل حدث إرسال النموذج منها في تقارير أحداث Analytics:

مسار صفحة تسمية الحدث

ضمن "نتيجة عدم التفاعل" ، يمكنك تحديد صواب أو خطأ. نتيجة عدم التفاعل هي معلمة تسمح لك بتحديد ما إذا كان الحدث الذي يتم تشغيله سيؤثر على مقاييس مثل معدل الارتداد أم لا . على سبيل المثال ، إذا كانت لديك صفحة يتم فيها تشغيل الفيديو تلقائيًا ، فقد ترغب في تحديد "صحيح". وإلا ، فإن كل من يهبط إلى تلك الصفحة سيبدأ حدثًا ، وسيكون معدل الارتداد صفرًا.

لتتبع إرسال النموذج ، أوصي بتحديد "خطأ" - لا سيما إذا كان النموذج الذي تتبعه موجودًا على صفحة مقصودة حيث يرى الزائر جميع المعلومات التي يحتاجها ويملأ نموذج الاستفسار الخاص بك. بعد كل شيء ، حتى إذا لم يشاهدوا صفحة أخرى على موقع الويب الخاص بك ، فقد تفاعلوا وأكملوا الإجراء المطلوب ، لذلك يجب أن يكون نتيجة تفاعل:

مدير علامات google لمعلمات الزيارات بدون تفاعل

بعد ذلك ، انقر فوق "متابعة" وحدد "المزيد" ضمن "تشغيل". حدد "نموذج" ثم انتقل إلى المشغل الذي أنشأته سابقًا:

اختيار الزناد لعلامة google tag manager

انقر فوق "إنشاء علامة" ، وستظهر علامتك النهائية على النحو التالي:

شكل إرسال العلامة كاملة مدير علامات جوجل

الخطوة 5 - الاختبار

توجه إلى وضع المعاينة وتصحيح الأخطاء لاختبار ما إذا كان تتبع الحدث الجديد يعمل أم لا:

وضع المعاينة والتصحيح مدير علامات جوجل

في المتصفح نفسه ، افتح علامة تبويب جديدة وانتقل إلى موقع الويب الخاص بك ، حيث سيفتح برنامج Tag Manager لك وضع التصحيح. من هنا يمكنك معاينة الحاوية الخاصة بك وسوف تخبرك بالعلامات التي تم تشغيلها أو التي لم يتم تشغيلها على صفحتك:

تصحيح ومعاينة GTM

في المثال أعلاه ، لم يتم تنشيط أي من هذه العلامات على صفحتي ، بما في ذلك عمليات إرسال نموذج الاستفسار. يمكنني الآن اختبار النموذج مباشرة على الصفحة ومعرفة ما إذا كانت العلامة الصحيحة تنتقل إلى "العلامات التي تم تنشيطها على هذه الصفحة":

أطلقت العلامات اختبار وضع التصحيح

الخطوة 6 - انشر

بمجرد أن تختبر أن علامتك تعمل ، عد إلى لوحة معلومات GTM وانشر إصدارك. تذكر أنه يمكنك إعادة تسمية الإصدارات والعودة إلى الإصدارات إذا لم يعمل الإصدار التالي تمامًا:

نشر إصدار google tag manager

Ta-da - أصبحت علامة تتبع الحدث الجديدة والمشغل الآن مباشرًا.

تحسين النموذج

قد ترغب في تحسين النماذج على موقعك لزيادة تحويلاتك. يمكنك استخدام GTM لتتبع كل حقل نموذج لمعرفة ما يجب اختباره وتحسينه. بدلاً من ذلك ، يمكنك استخدام خدمة مثل Hotjar لمنحك تحليل قمع مفيد لتحسين معدل التحويل.

استنتاج

إذا كنت ترغب في تحسين الكفاءة وإزالة صداع الاختبار عندما يتعلق الأمر بإعداد تتبع الأحداث ، فإنني أوصي بشدة باستخدام Google Tag Manager.

لقد وجدت أنه عندما ينشغل المطورون في العمل على مشاريع أكبر جارية على موقع ويب ، فإنهم يقدرون هذا القرار لأنه يوفر وقتهم. على مستوى الدخول ، يمكنك استخدام العلامات المضمنة في إدارة العلامات وتمكنك ميزات التحكم في الإصدار ووضع التصحيح من اختبار كل شيء بنفسك.

إذا كنت قد استخدمت Google Tag Manager لتنفيذ تتبع أحداث النموذج باستخدام هذا الدليل ، فنحن نود أن نسمع عنها في التعليقات أدناه. أو بدلاً من ذلك ، تواصل معي على TwitterDigital_Kym.


إذا كنت بحاجة إلى مساعدة بشأنك فلا تتردد في الاتصال بنا.