إضافة analytics.js إلى موقعك الإلكتروني

مكتبة analytics.js (المعروفة أيضًا باسم "علامة إحصاءات Google") هي مكتبة JavaScript لقياس كيفية تفاعل المستخدمين مع موقعك الإلكتروني. يوضّح هذا المستند كيفية إضافة علامة "إحصاءات Google" إلى موقعك الإلكتروني.

علامة "إحصاءات Google"

يجب إضافة علامة "إحصاءات Google" بالقرب من أعلى العلامة <head> وقبل أي نص برمجي آخر أو علامات CSS، وإضافة رقم تعريف الموقع الخاص بموقع "إحصاءات Google" الذي تريد التعامل معه.

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

تقوم التعليمة البرمجية أعلاه بأربعة أشياء رئيسية:

  1. تُنشئ عنصر <script> يبدأ في تنزيل مكتبة JavaScript analytics.js بشكل غير متزامن من https://www.google-analytics.com/analytics.js.
  2. تعمل هذه السياسة على إعداد دالة ga عامة (تسمّى قائمة انتظار أوامر ga()) التي تسمح لك بجدولة الأوامر ليتم تشغيلها بعد تحميل مكتبة analytics.js وتصبح جاهزة للعمل.
  3. تضيف هذه الأداة أمرًا إلى قائمة انتظار الأوامر ga() من أجل إنشاء عنصر أداة تتبُّع جديد للموقع الإلكتروني الذي تم تحديده من خلال مَعلمة 'GA_MEASUREMENT_ID'.
  4. يضيف أمرًا آخر إلى قائمة انتظار الأوامر ga() لإرسال مشاهدة صفحة على الويب إلى "إحصاءات Google" للصفحة الحالية.

قد تتطلّب عمليات التنفيذ المخصّصة تعديل آخر سطرَين من علامة "إحصاءات Google" (الأمران create وsend) أو إضافة رمز إضافي لتسجيل المزيد من التفاعلات. ومع ذلك، يجب عدم تغيير الرمز الذي يحمِّل مكتبة analytics.js أو يؤدي إلى إعداد وظيفة قائمة انتظار الأوامر ga().

علامة بديلة غير متزامنة

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

تتيح العلامة غير المتزامنة البديلة أدناه إمكانية استخدام ميزة التحميل المُسبق، ما سيساهم في تعزيز الأداء قليلاً على المتصفّحات الحديثة، ولكن قد ينخفض إلى مستوى التحميل والتنفيذ المتزامنين على الإصدار 9 من IE ومتصفّحات الأجهزة الجوّالة القديمة التي لا تتعرّف على سمة النص البرمجي async. لا تستخدِم إعدادات العلامة هذه إلا إذا كان زوّار موقعك الإلكتروني يستخدمون المتصفّحات الحديثة في المقام الأول للوصول إلى موقعك الإلكتروني.

<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->

ما البيانات التي تسجِّلها علامة "إحصاءات Google"؟

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

  • إجمالي الوقت الذي يقضيه المستخدم على موقعك الإلكتروني.
  • الوقت الذي يقضيه المستخدم في كل صفحة وترتيب زيارة تلك الصفحات.
  • الروابط الداخلية التي تم النقر عليها (استنادًا إلى عنوان URL لمشاهدة الصفحة التالية)

بالإضافة إلى ذلك: يتمّ استخدام عنوان IP وسلسلة وكيل المستخدم والفحص الأولي للصفحة الذي يُجريه analytics.js عند إنشاء عنصر أداة تتبُّع جديد لتحديد أمور مثل:

  • الموقع الجغرافي للمستخدِم.
  • المتصفح ونظام التشغيل اللذين يتم استخدامهما.
  • حجم الشاشة وما إذا كان قد تم تثبيت Flash أو Java
  • موقع الإحالة.

الخطوات التالية

بالنسبة إلى احتياجات إعداد التقارير الأساسية، قد تكون البيانات التي يتمّ جمعها عبر علامة "إحصاءات Google" كافية، ولكن في كثير من الحالات، هناك أسئلة إضافية تريد الإجابة عنها عن المستخدِمين.

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

يوضّح الدليل التالي في هذه السلسلة آلية عمل analytics.js.