شرح احتراف التعامل مع قوالب XenForo وفهم وظيفة كل قالب 02

الدرس الثاني: احتراف التعامل مع قوالب XenForo وفهم وظيفة كل قالب​

مقدمة​

من هنا تبدأ مرحلة فهم التصميم من الداخل!

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

أما في هذا الدرس فسنتعمق في واحد من أهم أجزاء نظام XenForo، وهو القوالب Templates.

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

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

---

1- ما هي القوالب Templates؟​

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

بمعنى آخر، عندما تفتح الصفحة الرئيسية للمنتدى، فأنت تشاهد مجموعة من القوالب التي تعمل معاً لإظهار الصفحة بالشكل النهائي.

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

على سبيل المثال:

• قالب مسؤول عن الهيكل العام للصفحة.
• قالب مسؤول عن عرض الأقسام.
• قالب مسؤول عن عرض قائمة المواضيع.
• قالب مسؤول عن عرض المشاركات.
• قوالب مسؤولة عن بيانات الأعضاء.
• قوالب مسؤولة عن القوائم والهيدر والفوتر.

الصورة توضح واجهة إدارة القوالب في XenForo، حيث تستطيع الوصول إلى القوالب الخاصة بالاستايل الذي تعمل عليه.
المصدر: توثيق XenForo الرسمي – Templates.

2- كيف تصل إلى القوالب من لوحة التحكم؟​

للوصول إلى القوالب، ادخل إلى لوحة تحكم الإدارة، ثم اتبع المسار التالي:

لوحة تحكم الإدارة ← المظهر ← القوالب

ستظهر لك قائمة طويلة تحتوي على أسماء القوالب الموجودة في الاستايل.

من هذه الواجهة يمكنك:

• استعراض جميع القوالب.
• البحث عن قالب محدد.
• فتح القالب ومشاهدة محتوياته.
• تعديل القالب وحفظ التغييرات.
• معرفة القوالب المعدلة والمخصصة.
• إنشاء قالب جديد عند الحاجة.

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

---

3- فهم أسماء القوالب ومعرفة وظيفة كل واحد منها​

هذه أهم نقطة في هذا الدرس.

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

لذلك سنقسم القوالب إلى مجموعات حسب وظائفها.

أولاً: قوالب الهيكل العام للمنتدى​

هذه القوالب تتحكم في الهيكل العام الذي تظهر داخله صفحات المنتدى.

من أشهرها:

لماذا يجب أن تتعلم هذه القوالب؟

لأن معظم التعديلات الكبيرة التي تتعلق بتوزيع عناصر الصفحة ومواقعها تبدأ من فهم الهيكل العام.

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

ثانياً: قوالب الصفحة الرئيسية والأقسام​

هذه المجموعة مسؤولة عن عرض الأقسام والمنتديات الفرعية في الصفحة الرئيسية.

من الأسماء المهمة:


مثال عملي:

لنفترض أنك تريد تغيير طريقة عرض الأقسام، أو التحكم في المعلومات الظاهرة أسفل اسم كل قسم، أو تعديل المسافات بين المنتديات.

بدلاً من تعديل قوالب عشوائية، تبدأ بالبحث عن القوالب المرتبطة بقائمة الأقسام، ثم تحدد القالب الذي يعرض العنصر المطلوب.

ثالثاً: قوالب المواضيع والمشاركات​

هذه من أكثر مجموعات القوالب استخداماً عند تصميم الاستايلات.

فهي تتحكم في شكل الموضوع، وطريقة عرض المشاركات، ومعلومات العضو، وأزرار التفاعل.

من القوالب المهمة:


ماذا يمكنك تعديل هذه المجموعة من خلالها؟

• شكل صندوق المشاركة.
• طريقة عرض اسم العضو.
• معلومات العضو الجانبية.
• المسافات بين المشاركات.
• منطقة التوقيع.
• شكل أزرار الرد والتفاعل.
• طريقة عرض عنوان الموضوع.

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

رابعاً: قوالب الأعضاء والملفات الشخصية​

هذه المجموعة مسؤولة عن الصفحات والعناصر المرتبطة بالأعضاء.

من أشهر القوالب:


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

خامساً: قوالب الهيدر والقوائم الجانبية والفوتر​

هذه المنطقة مهمة جداً لمن يريد تحويل شكل المنتدى بالكامل.

فالهيدر هو أول ما يراه الزائر، والقوائم الجانبية تساعد على تنظيم المحتوى، أما الفوتر فيمثل نهاية الصفحة ويحتوي عادةً على روابط ومعلومات إضافية.

عند التعامل مع هذه المناطق، لا تفترض أن كل عنصر له قالب مستقل باسمه الظاهر؛ بعض العناصر يتم تجميعها من خلال قوالب أخرى أو ماكروهات.

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

---

4- كيف تبحث عن قالب معين دون إضاعة الوقت؟​

يوفر XenForo إمكانية البحث عن القوالب من لوحة التحكم.

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

على سبيل المثال:

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

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

نصائح عند البحث:

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

يمكنك أيضاً الاستفادة من ميزة البحث في القوالب لمعرفة القوالب المرتبطة بعبارة أو عنصر معين.

المصدر: مثال على قائمة القوالب والبحث في XenForo.

---

5- ما الفرق بين القوالب HTML وقوالب CSS وLESS؟​

من الأخطاء الشائعة أن يعتقد المبتدئ أن جميع القوالب تؤدي الوظيفة نفسها.

لكن في XenForo يوجد اختلاف مهم بين نوعين من القوالب:

قوالب HTML​

هذه القوالب مسؤولة عن بناء العناصر وترتيبها داخل الصفحة، مثل صناديق المحتوى، والقوائم، والأزرار، ومعلومات الأعضاء.

ومن خلالها تستطيع التحكم في بنية العنصر ومكان ظهوره ومحتواه.

قوالب CSS وLESS​

هذه القوالب مسؤولة عن تنسيق العناصر وتحديد مظهرها، مثل الألوان والخطوط والخلفيات والأبعاد والحدود.

بمعنى بسيط:

• HTML يحدد ماذا سيظهر في الصفحة.
• CSS وLESS يحددان كيف سيبدو هذا العنصر.

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

للمزيد من التفاصيل يمكنك مراجعة: شرح القوالب في توثيق XenForo الرسمي.

---

6- ما هو نظام وراثة القوالب Template Inheritance؟​

هذه من الخصائص المهمة التي يجب أن تفهمها قبل التعديل على الاستايلات.

يعتمد XenForo على نظام وراثة القوالب من الاستايل الأب Parent Style إلى الاستايل الفرعي Child Style.

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

وعندما تقوم بتخصيص قالب داخل الاستايل الفرعي، يصبح لديه إصدار مخصص بدلاً من الاعتماد على الإصدار الموروث من الاستايل الأب.

ما فائدة هذه الخاصية؟

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

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

---

7- ما الفرق بين تعديل القالب Template Editing وتعديلات القوالب Template Modifications؟​

هنا نصل إلى نقطة مهمة جداً في إدارة استايلات XenForo.

هناك طريقتان مختلفتان لإجراء التعديلات على القوالب:

الطريقة الأولى: تعديل القالب مباشرة​

من خلال فتح القالب داخل لوحة التحكم وإجراء التعديلات على محتوياته ثم حفظه.

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

الطريقة الثانية: Template Modifications​

وهي نظام يسمح بإجراء تعديلات على أجزاء محددة من القوالب دون الحاجة إلى استبدال القالب الأصلي بالكامل.

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

لماذا تعتبر هذه الطريقة مفيدة؟

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

لكنها ليست ضماناً مطلقاً لعدم حدوث تعارض؛ فقد تتأثر التعديلات إذا تغير محتوى القالب الأساسي بعد تحديث المنتدى.

لذلك ننصح بمراجعة توثيق XenForo الرسمي حول هذه الميزة:

Template Modifications – XenForo Documentation

---

8- ما المقصود بالقوالب المعدلة Outdated Templates؟​

عند تحديث XenForo أو تحديث الاستايل، قد تظهر لك مشكلة القوالب المعدلة أو القديمة.

ما معنى ذلك؟

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

وهنا يظهر مفهوم Outdated Templates.

هل يجب إعادة جميع القوالب إلى حالتها الأصلية؟

لا.

يجب أولاً معرفة طبيعة التغييرات الموجودة في القالب، وهل هي ضرورية أم لا، وهل تتعارض مع التحديث الجديد.

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

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

---

9- كيف تتعامل مع القوالب بطريقة احترافية؟​

حتى تصبح قادراً على تطوير استايل متكامل، لا بد أن تتبع أسلوباً منظماً عند العمل.

إليك أهم الممارسات:

• حدد العنصر الذي تريد تعديله قبل الدخول إلى القوالب.
• ابحث عن القالب المسؤول عن هذا العنصر.
• افهم وظيفة القالب قبل إجراء أي تغيير.
• تحقق من القوالب المرتبطة به.
• احتفظ بنسخة من المحتوى الأصلي قبل التعديل.
• نفّذ التغييرات بشكل تدريجي.
• اختبر النتيجة بعد كل تعديل.
• راجع القوالب المعدلة بعد تحديث XenForo.

قاعدة مهمة: لا تبحث عن قالب لمجرد أن اسمه يشبه العنصر الذي تريد تعديله؛ افحص علاقته بالعنصر أولاً، فقد يكون مجرد قالب مساعد أو جزءاً من قالب أكبر.

---

10- مصادر مهمة لتعلم القوالب من XenForo​

إذا كنت تريد التعمق أكثر، فهذه مجموعة من المصادر التي أنصحك بالاحتفاظ بها:

• Templates – دليل القوالب الرسمي: شرح نظام القوالب وطريقة عملها.
• Template Syntax – مرجع لغة القوالب: مرجع لفهم وظائف وعناصر نظام القوالب.
• Template Modifications – تعديلات القوالب: شرح نظام التعديلات.
• مثال عملي على البحث عن القوالب: صورة توضيحية لواجهة إدارة القوالب.

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

---

ماذا سنتعلم في الدرس الثالث؟​

في الدرس القادم سننتقل إلى مرحلة جديدة، وهي التعامل مع CSS وLESS بشكل احترافي، وسنبدأ بتعلم كيفية التحكم في كل عنصر من عناصر المنتدى وتغيير مظهره.

سنتناول الموضوعات التالية:

• فهم Classes وIDs بطريقة أعمق.
• معرفة أهم الكلاسات المستخدمة في XenForo.
• كيفية استخدام Inspect للوصول إلى العناصر.
• التحكم في الألوان والخلفيات والحدود.
• تعديل أحجام العناصر والمسافات.
• التعامل مع الخطوط والأيقونات.
• تصميم الصناديق والأزرار والقوائم.
• فهم كيفية تنظيم أكواد CSS داخل extra.less.
• حل تعارضات الأكواد وتجنب التأثير على بقية المنتدى.

---

خاتمة الدرس الثاني​

وصلنا إلى نهاية الدرس الثاني من سلسلة احتراف تعديل وتصميم استايلات XenForo.

تعرفنا على مفهوم القوالب، والفرق بين أنواعها، ووظائف القوالب الأساسية، وكيفية البحث عنها، وفهم نظام الوراثة، بالإضافة إلى الفرق بين تعديل القوالب مباشرة واستخدام Template Modifications.

تذكر أن معرفة القالب المسؤول عن كل عنصر هي نصف عملية التصميم؛ فكلما فهمت بنية XenForo بصورة أفضل، أصبحت تعديلاتك أكثر دقة واحترافية.

انتظروا الدرس الثالث: احتراف CSS وLESS ومعرفة أهم الكلاسات في XenForo.

سلسلة تعلم تعديل وتصميم استايلات XenForo | الدرس الثاني من خمسة

حقوق كود نت​