كيفية إضافة كود برمجي مخصّص (Code Snippet) في منصتك على مساق

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

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

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

دليل التعامل مع الأكواد المخصصة

قبل أن تبدأ في إضافة الأكواد، إليك بعض النصائح الهامة:

1. إزالة حدث DOMContentLoaded:

إذا كنت تستخدم هذا الحدث في أكوادك، يجب عليك التوقف عن استخدامه الآن. يتم تنفيذ الكود في useEffect في React، والتي تُشغَّل بعد تحميل الصفحة الأولي.

2. تنفيذ الكود في كل عرض للصفحة:

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

window.APP_EVENTS.PAGE_VIEW.push((url) => {
    // add your code here 
});

يمكنك استخدام URL لتحديد رابط الصفحة إذا كنت تريد تنفيذ الكود في صفحة محدّدة فقط.

التعامل مع أكواد HTML المخصصة التي تحتوي على وسوم التعامل مع أكواد HTML المخصصة التي تحتوي على وسوم <script>:
لتجنب مشاكل Uncaught SyntaxError إعادة تعريف المتغيرات عند مغادرة المستخدم للصفحة والعودة إليها، قم بتضمين الكود الخاص بك داخل دالة Immediately Invoked Function Expression (IIFE) كما موضّح أدناه:

(function(){
    // add variables 
    // add your code 
})();

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

كيفية الوصول إلى تبويب "الأكواد المخصّصة"

اذهب إلى القائمة الجانبية في لوحة التحكم.
انتقل إلى "الإعدادات".
اختر "إعدادات المنصة".
انتقل إلى تبويب "الأكواد المخصصة".

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

كيفية إضافة كود مخصّص إلى المنصة

اختر المكان المناسب لإضافة الكود: حدد القسم الذي تريد إضافة الكود فيه من الصفحة المعروضة. على سبيل المثال، يمكنك اختيار "كود مخصص قبل نهاية وسم `<head/>`" لإضافة كود إلى رأس الصفحة.

أدخل الكود البرمجي في المحرر: الصق الكود الخاص بك في منطقة التحرير.

احفظ التغييرات: انقر على زر "حفظ التعديلات" لتفعيل الكود.

إدارة الأكواد المخصصة

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

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

_الأسئلة الشائعة_

هل يمكنني إضافة أكثر من كود مخصص في نفس القسم؟
نعم، يمكنك إضافة عدة أكواد مخصصة في نفس القسم.

هل يمكنني معاينة تأثير الكود المخصص قبل حفظه؟
للأسف، لا تتوفر ميزة المعاينة المباشرة في الوقت الحالي. يمكنك حفظ الكود والتحقق من تأثيره على منصتك، ثم تعديله إذا لزم الأمر.

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

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

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

تحديث في: 08/02/2025