تصميم صفحات المقالات في قولي باستخدام Article Layouts

تصميم صفحات المقالات في قولي لم يعد مقتصرًا على الاختيار بين مجموعة ثابتة من القوالب. مع نظام Article Layouts أصبح بإمكان فرق التحرير وإدارة المواقع التحكم في طريقة بناء صفحة المقال نفسها، واختيار العناصر التي تظهر فيها، وترتيبها، وإضافة الـ Widgets، والتحكم في الشريط الجانبي، ثم معاينة النتيجة باستخدام نفس محرك عرض صفحة المقال الحقيقية قبل نشر التصميم.

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

تم تقديم هذا التطوير ضمن 2ooly CMS 3.9.0، ويمكنك مراجعة موضوع «ما الجديد» للاطلاع على بقية التحسينات التي جاءت مع الإصدار.

ما الذي تغير في تصميم المقالات داخل قولي؟

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

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

ما هو Article Layout؟

الـ Article Layout هو تعريف لطريقة تكوين صفحة تفاصيل المقال. وهو لا يغير محتوى المقال نفسه، بل يحدد كيف يتم عرض عناصره للزائر.

يمكن للتصميم أن يضم عناصر المقال الأساسية مثل:

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

ويتم حفظ ترتيب هذه العناصر وإعداداتها داخل التصميم، بحيث يمكن إعادة استخدام نفس الـ Layout مع عدد كبير من المقالات دون تكرار الإعدادات يدويًا في كل موضوع.

القوالب الجاهزة ما زالت موجودة

لم يتم إلغاء التصميمات السابقة. قولي يحتفظ بها كـ Predefined Article Layouts للحفاظ على شكل المقالات القديمة وعدم تغيير تجربة المواقع الحالية بعد التحديث.

هذه التصميمات المدمجة محمية من التغييرات التي قد تؤثر على التوافق. وإذا أردت إنشاء نسخة مختلفة منها، يمكنك استخدام فكرة Duplicate to customize: تنسخ التصميم ثم تعدل النسخة الجديدة، بينما يظل التصميم الأصلي محفوظًا.

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

Layout Builder: بناء صفحة المقال بصريًا

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

يمكن لمدير الموقع من خلال الـ Builder إعادة ترتيب العناصر، وإضافة أو إزالة العناصر الاختيارية، وضبط إعداداتها، وإضافة Widgets في أماكن مختلفة من صفحة المقال.

كما أن محتوى المقال نفسه يظل عنصرًا أساسيًا لا يمكن حذفُه من تصميم صالح للنشر، وهو ما يمنع إنشاء Layout يؤدي إلى اختفاء المادة التحريرية بالخطأ.

استخدام Widgets داخل تصميم المقال

من أهم التغييرات في النظام الجديد أن Article Layouts تستخدم منظومة Widgets الموجودة بالفعل في قولي، بدل إنشاء نظام Blocks منفصل.

هذا يعني إمكانية استخدام Widgets مثل الإعلانات، النشرات البريدية، الاستطلاعات، الموضوعات المقترحة، المعارض، أو الـ Custom HTML داخل تصميم المقال، مع استمرار تطبيق إعدادات وصلاحيات وحالة كل Widget.

ويمكن استخدام نفس الـ Widget في أكثر من مكان دون الحاجة إلى إنشاء نسخة جديدة منه لمجرد إضافته إلى Article Layout.

إضافة Widget داخل محتوى المقال دون تعديل النص

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

تتم عملية الإدراج أثناء الـ rendering، أي أن النظام لا يعدل المحتوى المخزن للمقال. كما يبحث عن حدود آمنة بين عناصر المحتوى ويتجنب إدخال الـ Widget داخل الجداول أو القوائم أو العناوين أو العناصر المضمنة بطريقة قد تفسد الـ HTML.

وتظل كذلك الـ Widgets التي أضافها المحرر يدويًا داخل المقال متوافقة مع النظام الجديد.

التحكم في الـ Sidebar

أصبح الشريط الجانبي جزءًا واضحًا من إعدادات Article Layout. ويمكن للتصميم تحديد واحد من ثلاثة أوضاع:

• Inherit: استخدام سلوك الشريط الجانبي الموروث من إعدادات المقال أو الموقع.
• Hide: إخفاء الشريط الجانبي في هذا التصميم.
• Custom: إنشاء Sidebar خاص بالـ Layout وإضافة Widgets إليه وترتيبها.

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

القراءة الصوتية جزء من التصميم

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

وبذلك لا يفقد التصميم الجديد خصائص مهمة كانت متاحة في صفحات المقالات التقليدية.

اختيار التصميم من شاشة المقال

تعرض شاشة إنشاء أو تعديل المقال الآن نظام اختيار واحدًا للـ Article Layout بدل وجود أكثر من طريقة متنافسة لاختيار التصميم.

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

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

معاينة التصميم قبل النشر

تتيح خاصية Preview Layout فتح التصميم في تبويب جديد باستخدام نفس Article Details renderer المستخدم في الموقع الحقيقي.

لذلك تظهر في المعاينة نفس عناصر الواجهة العامة، وملفات CSS، والصور، واتجاه RTL أو LTR، والـ Sidebar، والـ Widgets، وأدوات القراءة الصوتية، والسلوك المتجاوب مع أحجام الشاشات.

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

تعديل التصميم وإدارة الصلاحيات

المستخدم الذي يمتلك صلاحية تعديل Article Layout يستطيع الانتقال من المقال مباشرة إلى Edit Layout وفتح الـ Layout Builder.

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

ويظل نشر التصميم صلاحية مستقلة عن مجرد تعديل المسودة، حتى لا يؤدي تعديل Layout مستخدم في عدد كبير من المقالات إلى تغيير الموقع مباشرة دون مراجعة.

Draft وPreview وPublish

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

هذه الآلية مهمة خصوصًا للمواقع الإخبارية والمؤسسات التي قد تستخدم نفس Article Layout في مئات أو آلاف المقالات، لأن تعديل التصميم يصبح عملية يمكن مراجعتها قبل تطبيقها على القراء.

دعم العربية والإنجليزية والتصميم المتجاوب

يعتمد الـ Layout Builder على نفس مسار عرض صفحة المقال، لذلك يحافظ على سلوك RTL للمحتوى العربي وLTR للغات الأخرى، ويستخدم نفس قواعد الصور والمسافات والخطوط وسلوك المحتوى الغني والجداول والقوائم.

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

متى تحتاج إلى إنشاء Article Layout جديد؟

يمكن استخدام تصميمات مختلفة عندما تختلف طبيعة المحتوى أو الهدف من الصفحة. مثلًا:

• تصميم إخباري سريع يبرز العنوان والصورة ووقت النشر.
• تصميم للمقالات الطويلة يركز على القراءة ويخفي الشريط الجانبي.
• تصميم تجاري يحتوي على مواضع إعلانية أعلى المقال وداخله وأسفله.
• تصميم لمقالات الكتّاب يبرز بيانات الكاتب والمحتوى النصي.
• تصميم خاص لقسم معين مع Widgets مختلفة في الـ Sidebar.

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

الخلاصة

ميزة تصميم صفحات المقالات في قولي أصبحت نظامًا متكاملًا لإدارة Article Layouts، وليست مجرد مجموعة تصميمات ثابتة. يمكنك البدء من القوالب الجاهزة، أو نسخ أحدها وتخصيصه، أو إنشاء تصميم جديد يجمع عناصر المقال والـ Widgets والـ Sidebar والقراءة الصوتية، ثم معاينته باستخدام صفحة المقال الحقيقية قبل نشره.

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