# مكون عرض صندوق الفئات المحسّن
**URL:** https://meta.discourse.org/t/enhanced-category-box-display-component/156954
**Category:** Theme component
**Tags:** broken
**Created:** [6 يوليو 2020، 8:05م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954 "2020-07-06T20:05:00Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@oca](https://meta.discourse.org/u/oca)
#### Post date: [6 يوليو 2020، 8:05م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/1 "2020-07-06T20:05:00Z")
# discourse-theme-category-homepage
لقد عملتُ بشكل كبير على صفحة رئيسية جديدة بـ `category-box` لمجتمع منتداي. إنها مخصصة جدًا لاحتياجاتنا وقد لا تكون مفيدة للكثير من الأشخاص، لكن يمكن لأحد أن يستلهم منها أفكارًا.
## بعد/قبل
## حالة الاستخدام الخاصة بنا
لدينا مجتمع يتعامل مع مواضيع واسعة جدًا. نحن نوحد المنظمات غير الحكومية المحلية التي لديها أعضاء خاصون بها، ولدينا أيضًا مجموعات مستقلة، كل منها يقوم بإجراء واحد أو أكثر من الإجراءات التي تحتاج إلى الترويج لها، كما أنها تحتاج إلى مساحة خاصة لمناقشتها.
تشكل كبار السن جزءًا كبيرًا من أعضائنا، وأي إجراء يستغرق أكثر من 3 نقرات يعتبر صعبًا جدًا بالنسبة لهم (لذا فإن إدارة مستوى الإشعارات بالطريقة المعتادة غير ممكنة بالنسبة لهم).
المجتمع كبير بما يكفي لاحتياجنا إلى نظام فرز قوي، لكن المهارات الرقمية والرغبة لدى المستخدمين منخفضة جدًا، لذا نحتاج إلى الحفاظ على شيء سهل وواضح الاستخدام قدر الإمكان.
### تنظيم المواضيع
تُستخدم الفئات الرئيسية كاستضافة للأهداف الرئيسية للمجتمع.
أي موضوع لا يشير إلى مجموعة ينتمي إلى الفئة الرئيسية الأقرب، ويمكن تسميته بعلامات (Tags). العلامة غالبًا ما تكون موجودة ضمن فئة رئيسية، لكن ليس بالضرورة.
تقوم كل منظمة غير حكومية ومجموعة محلية بنشر إعلاناتها في فئة فرعية عامة من الفئة الرئيسية الأكثر ارتباطًا بوضوح، وتعمل بهدوء في فئة فرعية خاصة.
وبالتالي، يمكن للمستخدم العثور بسهولة على جميع المحتوى المتعلق بأحد أهدافنا الرئيسية (الفئة الرئيسية)، أو حول موضوع محدد (علامة قد تكون مشتركة بين عدة أهداف)، أو حول مجموعة محددة (فئة فرعية عامة)، إلخ.
## الميزات
- تمييز كل فئة لجعلها تبدو وكأنها قسم كامل من الموقع.
- الكتابة بخط عريض وإضافة أيقونة لأي شيء يمكن النقر عليه، مما يسهل التركيز على الأشياء المهمة.
- إضافة عناصر إضافية لكل فئة:
- العدد المعتاد للمشاركات
- محدد مستوى الإشعارات
- رابط “انقر هنا لعرض جميع المشاركات المتعلقة بهذا المجال” لتكون أكثر وضوحًا
- إضافة علامات مرتبطة بهذه الفئة
- إضافة رأس لجعل هذه العناصر واضحة جدًا كالمواضيع الرئيسية التي نناقشها
- يتم اختيار هذه العلامات من خلال إعدادات السمة (Theme)
- تم تصميم عرض العلامات بحيث تبدو العلامات فعليًا كعلامات، بحيث يفهم المستخدم ما نتحدث عنه عند استخدام كلمة «علامة».
- _ **ملاحظة:** يتم تحسين العرض بواسطة مكون أيقونة العلامة (Tag icon component)_
- إضافة رأس للفئات الفرعية لجعلها واضحة جدًا بأن هذه الفئات مخصصة للإعلانات، ورأس آخر لجعلها واضحة جدًا بأن هذه الفئات الفرعية خاصة (نعم، يوجد قفل ويفهم أي مستخدم من المستوى المتوسط ذلك. ولكن…)
- _ **ملاحظة:** يتم تحسين العرض بواسطة مكون أيقونة الفئة (Category icon component)_
- معظم هذه الميزات يمكن تبديلها (toggle-able).
## التثبيت
> ملاحظة: هذا المكون لا يزال **قيد التطوير**. ما زلت أقوم بتحديثه، وإصلاح أخطاء CSS التي قمت بنشرها في أماكن أخرى، إلخ. يرجى التحلي بالرحمة وإخباري إذا بدا أي شيء غريبًا.
قم بتثبيت المكون كما هو معتاد. [كيف أقوم بتثبيت سمة أو مكون سمة؟](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682)
[المستودع](https://framagit.org/oca/discourse-theme-category-homepage.git): `https://framagit.org/oca/discourse-theme-category-homepage.git`
## خارطة الطريق للتحسينات المستقبلية
[مكتمل] إصلاح العدد الهائل من أخطاء CSS.
[مكتمل] إصلاح الأمر الذي يفرض عرض فاصل/رأس للفئات الفرعية حتى لو لم تكن هناك فئة فرعية عامة أو خاصة.
[مكتمل] إنشاء صفحة فئة جميلة تعرض مربعات الفئات الفرعية والمواضيع.
[مكتمل] تحديث كل شيء بمجرد أن يقرر فريق Discourse أن الفئات الفرعية-الفرعية قد تصبح حقيقة (أعلم، دعني أتمنى…).
أنا منفتح على اقتراحات ميزات جديدة، لكنني سأضيفها في هذا المكون فقط إذا كانت تخدم حالة الاستخدام الخاصة جدًا بي أو إذا كانت سهلة التنفيذ للغاية. أي ميزة جديدة مضافة ستكون قابلة للتبديل (toggle-able).
---
### Author:  [@HAWK](https://meta.discourse.org/u/HAWK)
#### Post date: [6 يوليو 2020، 8:53م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/2 "2020-07-06T20:53:51Z")
> [@oca](#):
>
> هل يمكن لأحد إضافة وضع الويكي حتى أتمكن من تحديث المنشور العلوي عند الحاجة وإضافة وسم theme-component؟
لا مشكلة، تم ذلك.
---
### Author:  [@torstensson](https://meta.discourse.org/u/torstensson)
#### Post date: [29 نوفمبر 2020، 9:07ص UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/3 "2020-11-29T09:07:03Z")
شكرًا جزيلاً لك على إنشاء هذا المكون الرائع، إنه مذهل! :awthanks:
سؤال واحد: هل من الممكن تفعيله مع إعداد الفئة “الصناديق مع المواضيع المميزة”؟ إذا لم يكن كذلك، فهل هذه ميزة يمكن تنفيذها، أم تتوقع أي مشاكل مع ذلك؟
كل التوفيق، ومجددًا شكرًا جزيلاً على إنشائك لهذا! 🙏
---
### Author:  [@oca](https://meta.discourse.org/u/oca)
#### Post date: [1 ديسمبر 2020، 3:37م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/4 "2020-12-01T15:37:49Z")
> [@torstensson](#):
>
> سؤال واحد: هل من الممكن تفعيله مع إعداد الفئة “الصناديق مع المواضيع المميزة”؟ إذا لم يكن كذلك، فهل هذه ميزة يمكن تنفيذها، أم تتوقع أي مشاكل مع ذلك؟
مرحبًا، شكرًا لك.
ليس ممكنًا كما هو الحال حاليًا (فهو ليس الصندوق نفسه الذي يتم تعديله)، لكنه شيء يمكن تنفيذه بسهولة تمامًا. يمكنني مساعدتك في ذلك إذا أردت التحدث عبر الرسائل الخاصة، أو ربما ألقي نظرة عندما أجد بعض الوقت، لكن في هذه الحالة، أحتاج منك أن ترسم لي مخططًا لما تود (وكيف سيتم عرض الأشياء).
---
### Author:  [@torstensson](https://meta.discourse.org/u/torstensson)
#### Post date: [5 ديسمبر 2020، 10:22ص UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/5 "2020-12-05T10:22:16Z")
فهمت تمامًا.
بالنسبة لي، الميزة الحاسمة في المكون الخاص بك هي إضافة جرس حالة الإشعارات لكل فئة فرعية، بالإضافة إلى الطريقة البسيطة والقوية التي تمنح الحرية لتغيير عرض الأعمدة. بالنسبة لحالة الاستخدام الخاصة بي، سيكون توفير هذه الميزات مع تفعيل خيار “الصناديق مع المواضيع المميزة” مفيدًا جدًا لاحتياجاتي المحددة.
أنا مبتدئ، لكنني سأكون سعيدًا بمحاولة تنفيذ ذلك. أقدر أي تلميحات، لكنني سأقوم بفحص مكونات صناديق الفئات الأخرى وآمل أن أتمكن من معرفة كيفية القيام بذلك. سأجد وقتًا لفهم هذا الأمر جيدًا خلال بضعة أسابيع، وسأقوم بالتحديث هنا إذا أحرزت أي تقدم.
كل التوفيق.
---
### Author:  [@oca](https://meta.discourse.org/u/oca)
#### Post date: [18 ديسمبر 2020، 9:59م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/6 "2020-12-18T21:59:54Z")
واجهتُ بعض الصعوبات في [فعل ذلك](https://meta.discourse.org/t/can-parameters-be-injected-from-the-template-to-a-widget-action/155275/3)، لكن في النهاية لم يكن الأمر صعبًا إلى هذا الحد.
في مكون السمة (theme component)، قم بتعديل مكون هيندلبار (handlebar) ليشمل هذا الكود:
```plaintext
{{#each categories as |c|}}
...بعض الأشياء قبل الجرس...
{{category-notifications-button
value=c.notification_level
onChange=(action "changeCategoryNotificationLevel" c)
}}
...بعض الأشياء بعد الجرس...
{{/each}}
```
إذا لم تكن تعرف كيفية القيام بذلك، فإن [دليل جوهاني](https://meta.discourse.org/t/developer-s-guide-to-discourse-themes/93648) هو “أول مكان جيد للنظر فيه”.
وإذا عثرت على طريقة للقيام بنفس الشيء مع الوسوم (tags)، فالرجاء إخباري! [لم أتمكن من إيجاد طريقة للقيام بذلك](https://meta.discourse.org/t/add-a-tag-notification-level-button-with-ember/166194).
---
### Author:  [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [3 فبراير 2021، 5:27م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/7 "2021-02-03T17:27:19Z")
@oca لقد أجريت تغييرًا حديثًا في النواة يتسبب في فشل تجميع SCSS لمكون هذا السمات. الإصلاح بسيط جدًا، حيث يجب إزالة السطرين التاليين من ورقة الأنماط:
```scss
@import "common/foundation/variables";
@import "theme_variables";
```
(السطر الثاني يتسبب في خطأ تجميع SCSS لأن الملف لم يعد موجودًا. ومع ذلك، فإن كلا السطرين غير ضروريين، حيث يتم حقن متغيرات النواة والسمات الآن قبل تجميع أي ملف SCSS.)
---
### Author:  [@oca](https://meta.discourse.org/u/oca)
#### Post date: [3 فبراير 2021، 5:41م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/8 "2021-02-03T17:41:38Z")
شكرًا للتوضيحات.
تم الإزالة.
---
### Author:  [@Fma965](https://meta.discourse.org/u/Fma965)
#### Post date: [20 أبريل 2022، 8:47م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/9 "2022-04-20T20:47:18Z")
عمل رائع! هل هذا لا يعمل على الهاتف المحمول؟
> **[CyanLabs Official Community](https://community.cyanlabs.net/categories)**
>
> Home to all discussions relating to CyanLabs
الهاتف المحمول
سطح المكتب
---
### Author:  [@Fma965](https://meta.discourse.org/u/Fma965)
#### Post date: [7 مايو 2022، 8:42م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/10 "2022-05-07T20:42:12Z")
أتمنى لو أستطيع معرفة كيفية جعل هذا يعمل على الهاتف المحمول، يبدو رائعًا على سطح المكتب ولكن إذا لم يكن قابلاً للاستخدام على الهاتف المحمول فهو بلا فائدة، أنا متأكد من أن هناك طريقة بسيطة ولكنني لست متأكدًا من كيفية القيام بذلك، هل لدى أي شخص أي اقتراحات؟
---
### Author:  [@Fma965](https://meta.discourse.org/u/Fma965)
#### Post date: [8 مايو 2022، 7:12م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/11 "2022-05-08T19:12:35Z")
عذرًا على النشر المتعدد
لقد تمكنت من تجميع [Categories Layout Override](https://meta.discourse.org/t/categories-layout-override/131098) ليعمل على الهاتف المحمول فقط
ثم باستخدام نسختي المعدلة [GitHub - cyanlabs/discourse-categories-layout-override](https://github.com/CyanLabs/discourse-categories-layout-override)
يمكنني الآن تحديد التجاوز على أنه `categories_boxes`
مما يجبر عرض الهاتف المحمول على العرض المطلوب لكي يعمل هذا المكون الإضافي
جهاز لوحي
هاتف محمول
من الواضح أنها ليست حلاً مثاليًا ولكنه يعمل، لذا حتى يجد شخص ما حلاً أفضل، إليك حل بديل 🙂
---
### Author:  [@hoangphuctran93](https://meta.discourse.org/u/hoangphuctran93)
#### Post date: [11 فبراير 2023، 3:25م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/12 "2023-02-11T15:25:38Z")
شكراً لتخصيص المكون “Categories Layout Override”، ولكن هل يمكنك مشاركتي تخصيص المكون “Enhanced category-box display component”؟ لقد زرت موقعك، وأنا أقدر استخدامك لـ “background-color” للفئة “category-logo”
---
### Author:  [@hoangphuctran93](https://meta.discourse.org/u/hoangphuctran93)
#### Post date: [24 نوفمبر 2023، 4:57ص UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/13 "2023-11-24T04:57:50Z")
شكراً للتخصيصات الأخيرة، ولكن مع الترقية الأخيرة إلى الإصدار 3.2.0.beta 4-dev لم تعمل مكونات الثيم. آمل أيضاً أن يتم دمج تخصيصات العرض على الهاتف المحمول في جوهر Discourse. لأنني أريد تجربة متزامنة من سطح المكتب إلى الهاتف المحمول.
---
### Author:  [@Fma965](https://meta.discourse.org/u/Fma965)
#### Post date: [10 ديسمبر 2023، 8:22م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/14 "2023-12-10T20:22:50Z")
للأسف ليس لدي فكرة عن كيفية إصلاحه.
---
### Author:  [@hoangphuctran93](https://meta.discourse.org/u/hoangphuctran93)
#### Post date: [10 يناير 2024، 3:40ص UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/15 "2024-01-10T03:40:20Z")
مؤخرًا عند الترقية إلى أحدث إصدار، لم يعد مكون السمة “discourse theme category homepage” يعمل على الهاتف المحمول، وأستمر في تلقي الرسالة التالية
هذا هو موقعي [https://businesslab.vn/categories](https://businesslab.vn/categories)
---
### Author:  [@david](https://meta.discourse.org/u/david)
#### Post date: [10 يناير 2024، 9:43ص UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/16 "2024-01-10T09:43:06Z")
مرحباً @hoangphuctran93، لقد نقلت مشاركتك إلى موضوع المكون ذي الصلة (تحية @oca)
---
### Author:  [@stephtara](https://meta.discourse.org/u/stephtara)
#### Post date: [7 ديسمبر 2025، 9:59ص UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/17 "2025-12-07T09:59:25Z")
أوه، هذا يبدو وكأنه شيء سيكون مفيدًا جدًا لي! مجتمع دعم نشط مع مجموعة واسعة من المواضيع ولكن أشخاص من المرجح أن يبقوا في جزء فرعي صغير من الحديقة الضخمة، ومحو الأمية الرقمية منخفضة جدًا لدى الكثيرين. من المحزن رؤية أنه يبدو معطلاً، سأحاول استخدامه على أي حال. @oca هل ما زلت تستخدمه بنشاط من جانبك؟
---
### Author:  [@hellekin](https://meta.discourse.org/u/hellekin)
#### Post date: [11 ديسمبر 2025، 5:23م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/18 "2025-12-11T17:23:37Z")
احذر من وسم `#broken`، فهو _سوف_ يتعطل.
> [@stephtara](#):
>
> الأشخاص الذين من المحتمل أن يبقوا في جزء فرعي صغير من الحديقة الضخمة، ومحو الأمية الرقمية منخفضة نسبيًا للكثيرين
أقترح كتم جميع الفئات افتراضيًا، وإعداد مواضيع موسومة بـ `#welcome` لتقديم نظرة عامة على الفئات المتاحة. عندما تربط مجموعة بمتابعة فئة، يمكنك إنشاء تجربة تدريجية، حيث يمكن للأشخاص الانضمام إلى مجموعات لإلغاء كتم/اكتشاف الفئات. من خلال عدد قليل جدًا من المواضيع الترحيبية، يمكنك تزويد القراء بنظرة عامة عما هو متاح ومنحهم الخيار للمكان الذي يريدون المشاركة فيه. توثيق الإشعارات مهم أيضًا لتجنب الحمل الزائد للمعلومات.
---
### Author:  [@stephtara](https://meta.discourse.org/u/stephtara)
#### Post date: [11 ديسمبر 2025، 5:28م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/19 "2025-12-11T17:28:07Z")
> [@hellekin](#):
>
> احذر من وسم #broken::tag، فهو _سوف_ يتعطل.
شكرًا على التنبيه، ربما يجب أن أبتعد إذن…
> [@hellekin](#):
>
> توثيق الإشعارات مهم أيضًا لتجنب الحمل الزائد للمعلومات.
بالتأكيد!
---
### Author:  [@hellekin](https://meta.discourse.org/u/hellekin)
#### Post date: [11 ديسمبر 2025، 5:39م UTC](https://meta.discourse.org/t/enhanced-category-box-display-component/156954/20 "2025-12-11T17:39:48Z")
يمكنك محاولة تثبيت مكون السمة… ولكن ليس على نظام الإنتاج الخاص بك 🙂