ما أود القيام به (وأعلم أنه لا توجد إعدادات أو مجموعة ميزات مدمجة) هو استخدام CSS لتجميع الفئات في الصفحة الرئيسية.
لا أبحث عن تداخل الفئات، بل فقط تجميع بعضها معًا وإضافة عنوان فوقها ربما. أعرف أنه يمكن “فصل” الفئات الفردية باستخدام الحشو (padding)، وأعلم أنه يمكن استهداف كل فئة بمعرف الفئة (category ID) أو اسم الفئة. لذا، فإن أملِي هو القدرة على تكرار شيء يبدو مثل هذا:
أدرك أنه من أجل البساطة، يجب أن تكون الفئات مرتبة حسب الترتيب الحالي، وأن يتم استهداف كل فئة بواسطة معرف الفئة، لكنني أفكر في أنه قد يكون هناك بعض CSS يمكنه إضافة حشو بعد فئة معينة أو قبل فئة أخرى.
السؤال الكبير هو: هل توجد إمكانية لإدراج بعض النص في الحشو لإنشاء عنوان؟
الهدف من هذا هو أولاً تقسيم عرض قائمة الفئات الطويلة، وفصلها على النحو التالي: مثال
الفئتان 1 و2 تحت عنوان “الموظفين”
الفئتان 3 و4 تحت عنوان “مصادر المجتمع”
الفئات 5، 8، 11، 12، 13 تحت عنوان “فئات النقاش العام”
لا أريد تحويل هذه إلى فئات فرعية، فأنا أحب البنية ونظام الفئات كما هو. كل ما أريده هو عرض الفئات بشكل مختلف قليلاً في صفحة عرض الفئات.理想ًا، يكون هذا مجرد تخطيط بصري، ولا شيء يغير البنية البرمجية للمنصة.
هل لديك أي فكرة حول كيفية تحقيق ذلك؟
سيكون هذا نوعًا من التغيير الجوهري في تخطيط موقعي للتعاون في العمل.
سام، كودينغهورور، هل تعتقد أنه يمكن إنشاء خطوة تجميع في قائمة إعادة تنظيم الفئات تقوم بذلك بشكل أصلي، كخيار (تفعيل/إيقاف التجميع)؟ فقط ضع الفئات بالترتيب داخل التجميع في الصفحة الرئيسية، ويمكن أن يفصلها تلقائيًا. هل هذا في النواة (Core)، أم في إضافة (Plugin)، أم في مكون سمة (Theme component)؟
This kind of stuff is possible in a theme component but extremely complicated. I think you would need to override templates which makes this also pretty fragile.
في وقت متأخر قليلاً ولكن ربما يحتاج شخص آخر إليها. يجب أن أذكر أن:
ليس كل كود CSS مطلوبًا، خاصة الحدود وألوان الخلفية لصفوف الجدول، لذا لا تتردد في تعديلها كما تحب.
كان عليّ تغيير التخطيط من الجدول العادي إلى flex لأنه لا يمكن استخدام الهوامش السالبة على صفوف الجدول ومشاكل تخطيط أخرى، وبشكل عام… هو أكثر مرونة
استبدل Category Group 1 و Category Group 2 بأسماء مجموعات الفئات المطلوبة.
في مثالتي استخدمت معرفات الفئات 2 و 4، لذا باستخدام أدوات مطوري Chrome لفحص العنصر (انظر الصورة أدناه)، ابحث عن معرف الفئة الصحيح واستبدل [data-category-id="2"] و [data-category-id="4"] في مثالتي بمعرفاتك.
معلومات في غاية الإثارة؛ شكرًا لك على المشاركة. وفي نفس السياق (أي السعي للحصول على عرض أفضل)، نحاول وضع صفحة ووردبريس ذات عرض محدد أمام الخطاب، ونود “إرسال” أسماء الفئات إلى هذه الصفحة، مثل الفئات التي تلقت ردًا، أو تلك التي اختارها المستخدم، أو فئة معينة. هل تعتقد أن هذا ممكن؟ وإذا كان كذلك، فكيف يمكن تحقيق ذلك؟
أخشى أنه لا يمكنك فعل ذلك باستخدام CSS فقط. ربما يكون إضافة ووردبريس ديوسرس هو ما تحتاجه. بالإضافة إلى ذلك، فإن اختصارات ووردبريس ديوسرس ضرورية أيضًا.
نحن نستخدمها بالفعل على موقعنا الإلكتروني الخاص بووردبريس وتعمل بشكل ممتاز حتى الآن. إليك كيف تبدو الإضافة في أداة الشريط الجانبي:
@sam، استجابة @cosdesign تعمل. هل توجد طريقة لدمج هذا في القوائم الأساسية بحيث يمكن للمستخدمين إبطاله افتراضيًا، ثم تعيين الرؤوس في لوحة الإدارة لعناوين رؤوس المجموعات، وفي صفحة سمات كل فئة، اختيار من قائمة منسدلة لرؤوس الأقسام المفعلة من لوحة الإدارة بحيث تقع الفئة ببساطة تحت الرأس.
لا ينبغي أن يكون هذا صعبًا بشكل مفرط لإضافته إلى المنصة، وسيحسن بشكل كبير التثبيتات الكبيرة متعددة أدوار المستخدمين والمجموعات، ومتعددة الفئات.
يمكنك تأكيد ذلك عن طريق إضافة بعض قواعد CSS التي تحتوي على اتجاه إلى سمة موقعك، ثم زيارة الموقع بلغة RTL ومعرفة ما إذا كان الاتجاه قد تم قلبه. لا أعتقد أنه سيتم قلبه.
على سبيل المثال، إذا أضفت هذا إلى السمة الخاصة بك:
المشكلة هي أن سمات Discourse لا يتم قلب قواعد CSS الخاصة بها. هذا يعني أنه إذا كان للموضوع قواعد CSS تحدد اتجاهًا، فسيكون الاتجاه هو نفسه عند استخدام لغة RTL كما هو الحال عند استخدام لغة LTR. إليك مثال بسيط على ذلك:
عند استخدام السمة مع واجهة RTL، لا يتم قلب padding-left: 8px; إلى padding-right: 8px; هذا يسبب مشكلة بسيطة في المحاذاة. أنا متأكد من وجود أمثلة لمشاكل أكبر تحدث عند استخدام السمات مع لغة RTL.
إذا كانت هذه القاعدة في ملف CSS أساسي لـ Discourse، فسيتم تحويل left: 0; تلقائيًا إلى right: 0; عند تحديد لغة RTL. نظرًا لأن CSS تتم إضافته إلى سمة، تحتاج إلى تعديله يدويًا إلى هذا:
body [data-category-id="2"]::before,body [data-category-id="4"]::before {
position: absolute;
top: -35px;
right: 0; // changed to the proper position for RTL layouts
font-weight: bold;
font-size: 15px;
text-transform: uppercase;
color: var(--primary-medium);
}
يضيف Discourse فئة rtl إلى علامة html عند استخدام تخطيط RTL. يمكن لمطوري السمات استخدام هذه الفئة لجعل سماتهم تعمل مع كل من تخطيطات LTR و RTL. هذا يعمل، وأعتقد أنه صحيح، ولكن ربما لا تحتاج عبارة left: auto إلى أن تكون هناك.
body [data-category-id="2"]::before,body [data-category-id="4"]::before {
position: absolute;
top: -35px;
left: 0;
font-weight: bold;
font-size: 15px;
text-transform: uppercase;
color: var(--primary-medium);
}
/* Fix positioning for rtl layouts */
.rtl body [data-category-id="2"]::before,.rtl body [data-category-id="4"]::before {
right: 0;
left: auto;
}
لست متأكدًا مما إذا كان يجب على المطورين اتباع هذا النهج مع سماتهم. إنه يستغرق وقتًا طويلاً ويمكن أن يؤدي إلى أخطاء ومشكلات في الصيانة. ربما يمكن لـ Discourse تجميع بعض السمات التي يمكن أن تفكر في توفير إصدار RTL. قد يكون من المفيد اختبار هذا النهج مع عدد قليل منها:
require "rtlcss"
Rtlcss.flip_css("theme_css")
كان من المفترض أن يكون هذا إجابة قصيرة إذا كان ما كتبته صحيحًا ولم يتم التعامل معه في موضوع آخر، فربما يجب نقله إلى موضوع جديد.
ولكن ربما يحتاج شخص آخر إليها. يجب أن أذكر أن:
إذا كان ما كتبته صحيحًا ولم يتم التعامل معه في موضوع آخر، فربما يجب نقله إلى موضوع جديد.