تثبيت رمز التتبع والمقتطف البرمجي على موقع إدكومرس الخاص بك

لدمج مقتطف برمجي في موقعك الإلكتروني، تتبع عادةً هذه الخطوات:

الخطوة 1. الحصول على كود المقتطف

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

إذا كنت تحاول تثبيت كود Google Tag Manager أو Meta Pixel، فاتبع الأقسام المخصصة أدناه:

• تثبيت Meta Pixel
• تثبيت Google Tag Manager

الخطوة 2. إضافة كود المقتطف إلى إدكومرس

إضافة البرامج النصية إلى إدكومرس بسيطة جدًا، ما عليك سوى الوصول إلى منطقة التكاملات والنقر على "إضافة كود نص برمجي".

املأ حقول تكامل البرنامج النصي كما يلي:

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

الخطوة 3: تحقق مرة أخرى من أن التكامل يعمل بشكل صحيح

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

تثبيت Google Tag Manager

الخطوة 1 - الحصول على مقتطف الكود الخاص بك من Google Tag Manager

للبدء، سجّل الدخول إلى حسابك في Google Tag Manager على <https://tagmanager.google.com>

بمجرد تسجيل الدخول، سترى قائمة بـ الحاويات المرتبطة بحسابك. حدد الحاوية التي تريد العمل عليها، أو أنشئ حاوية جديدة لإدكومرس.

بعد اختيار الحاوية، افتحها للوصول إلى محتوياتها. في نظرة عامة على الحاوية، ابحث عن معرّف الحاوية في قائمة الشريط العلوي وانقر عليه (يبدأ عادةً بـ GTM-XXX).

ستجد مقتطفَي كود: أحدهما لقسم <head> والآخر لقسم <body> في موقعك الإلكتروني. بالنسبة إلى إدكومرس، سنستخدم الكود الموجود في <head> فقط.

الخطوة 2. إضافة مقتطفات الكود الخاصة بك إلى إدكومرس

إضافة كود المقتطف إلى إدكومرس بسيطة جدًا، ما عليك سوى الوصول إلى منطقة التكاملات والنقر على الزر "إضافة كود نص برمجي".

املأ حقول تكامل البرنامج النصي كما يلي:

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

الخطوة 3: التحقق من أن Google Tag Manager يعمل بشكل صحيح

أسهل طريقة للتحقق من أنك أجريت التثبيت بشكل صحيح هي تثبيت إضافة Google Tag Assistant لمتصفح Chrome من سوق Chrome الإلكتروني.

بعد ذلك، اتبع هذه الخطوات:

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

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

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

تثبيت Meta Pixel

إذا كنت قد أعددت Meta Pixel باستخدام علامات IMG أو تخطط للقيام بذلك، فنوصيك باتباع وثائق مطوري Facebook.

في هذه المقالة، سنوضح لك كيفية إعداد Meta Pixel وتثبيته على موقع إدكومرس الخاص بك. لمعرفة المزيد عن البكسل قبل البدء، اطّلع على فوائد تثبيت Meta Pixel.

إذا كنت قد أنشأت Meta Pixel بالفعل وتريد العثور على الشفرة الأساسية للبكسل، فانتقل إلى الخطوة 2: إضافة البكسل إلى إدكومرس.

الخطوة 1: إنشاء Meta Pixel وإعداده

1. انتقل إلى مدير الأحداث.
2. انقر على مصادر البيانات المتصلة وحدد الويب.
3. حدد Meta Pixel وانقر على اتصال.
4. أضف اسم البكسل الخاص بك.
5. أدخل عنوان URL لموقعك الإلكتروني للتحقق من خيارات الإعداد السهل.
6. انقر على متابعة.

\يمكنك العثور على مزيد من المعلومات في مركز مساعدة [Meta Business.*](https://www.facebook.com/business/help/952192354843755?id=1205376682832142)

الخطوة 2. أضف بكسل الخاص بك إلى إدكومرس

ستضيف Meta Pixel الخاص بك إلى إدكومرس يدويًا، لذا تحتاج إلى نسخ البرنامج النصي من Meta Events Manager ولصقه في رأس موقع إدكومرس الخاص بك.

إضافة البرامج النصية إلى إدكومرس بسيطة جدًا، ما عليك سوى الوصول إلى منطقة التكاملات الخاصة بك والنقر على "إضافة رمز البرنامج النصي"

املأ حقول تكامل البرنامج النصي كما يلي:

• الاسم: أضف اسمًا إلى البرنامج النصي الخاص بك، على سبيل المثال Meta Pixel أو Facebook Pixel
• إدراج في: الرأس (لن نستخدم النص الأساسي لـ Meta Pixel)
• الرمز: انسخ هنا الرمز الموجود في Meta Events Manager.

وانقر على "حفظ".

الخطوة 3: تحقق مرة أخرى من أن Meta Pixel يعمل بشكل صحيح

للتحقق من أن Facebook Pixel متصل ويعمل بشكل صحيح، يمكنك اتباع هذه الخطوات:

1. سجّل الدخول إلى حساب Facebook Business Manager الخاص بك على https://business.facebook.com.
2. انتقل إلى علامة تبويب "مصادر البيانات" في الشريط الجانبي الأيسر.
3. ضمن قسم "وحدات البكسل"، يجب أن ترى Facebook Pixel الخاص بك مدرجًا. إذا كان متصلًا ويعمل بشكل صحيح، فستظهر نقطة خضراء تشير إلى أنه نشط.
4. انقر على اسم Pixel الخاص بك للوصول إلى إعداداته ومزيد من التفاصيل.
5. داخل إعدادات Pixel، يمكنك مراجعة الأحداث التي يتم تتبعها، والتحقق من وجود أي أخطاء أو تحذيرات، والاطلاع على النشاط الأخير لـ Pixel.