التخطي إلى المحتوى الرئيسي

تتبع Google Tag Manager

تعرض لك هذه المقالة كيفية تشغيل خدمة Google Tag Manager داخل الموقع الخاص بك.

ملاحظة

هذه الميزة متاحة فقط باللغة الانجليزية.

إن هذه المقالة لا تتبع تعليمات Google حرفيًا، ولكن تم اختبارها وعملت بشكل صحيح. وقد تم تغيير التعليمات عن تعليمات Google للأسباب التالية:

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

إضافة Google Tag Manager

سوف يعطيك Google الأكواد المضمنة التي ستبدو كما الأمثلة أدناه. يجب تثبيت كل هذه الأكواد في جزء <body-end> بالموقع. لتحديد مكان <body-end> ضمن الموقع، في اللوحة الجانبية للمحرر، انقر فوق الإعدادات، ثم انقر فوق Head HTML.

ملاحظة

الكود التالي هو مثال فقط؛ لا تنسخه مباشرة إلى الموقع الخاص بك. الرجاء التأكد من الحصول على الكود الصحيح من Google.

قسم البرنامج النصي

 
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXX');</script>
<!-- End Google Tag Manager -->

قسم NoScript

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

إعداد Google Tag Manager

تحذير

هذه الخطوة هامة للسماح بتتبع Google Tag Manager داخل الموقع الخاص بك.

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

  1. انتقل إلى Google Tag Manager وسجل الدخول.
  2. على اليسار، انقر على المشغلات.
  3. في الجانب الأيمن، انقر على الزر جديد.
  4. أدخل اسم المشغل في أعلى اليسار. ونحن نوصي باسم يمكن تذكره، مثل: مشغل طريقة عرض الصفحة المخصص.
  5. انقر على مربع تكوين المشغل المخصص وحدد الحدث المخصص.
  6. في مربع اسم الحدث، أدخل dPageView.
  7. انقر على حفظ في Tag Manager.

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

  1. في Tag Manager، انتقل إلى العلامات.
  2. أنشئ صفحة جديدة.
  3. أدخل اسم سهل التذكر.
  4. انقر على مربع تكوين العلامة وحدد العلامة التي تريد استخدامها. في هذه الحالة، هي Google Analytics Universal.
  5. بعد إعداد العلامة، انقر على المربع المشغل. اختر المشغل المخصص الذي أنشأناه تحت اسم "مشغل طريقة عرض الصفحة المخصص".

    6. ملاحظة

    إذا تم تطبيق مشغل "كل الصفحات" بالفعل، فيرجى حذفه. نحن بحاجة فقط إلى تشغيل المشغل المخصص.

  6. حدد متغيرًا جديدًا.
  7. حدد إعدادات Google Analytics.
  8. اكتب معرف تتبع Google Analytics الخاص بك، واكتب اسمًا للمتغير الخاص بك بأعلى.
  9. حدد المتغير وانقر على حفظ.

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

اعتبارات يجب أخذها في الحسبان تخص Google Tag Manager

  • سيتم تشغيل هذا الكود على الموقع المنشور فقط. من الأفضل الحرص على اختباره على الإصدار المنشور.
  • لقد أكملنا اختبارات مكثفة ويعمل قسم body-end.html ضمن وضع المطور على إضافة كود NoScript والكود الافتراضي.
  • الرجاء عدم تغيير إعداد 'dataLayer' من Google Tag Manager، لأن هذا سيؤدي إلى قطع التكامل المخصص.

مقالات ذات صلة