معاينات قائمة المواضيع (TLP)

هذا مكون سمة ولكنه يحتوي على خيار لإضافة مكون إضافي تكميلي.

|||
-|-|-|
:information_source: | ملخص | مكون معاينة الموضوع الأصلي الذي يسمح لك بإضافة صور ومقتطفات (والمزيد!) إلى قائمة الموضوعات مع إمكانية تكوين الإضافات التي تظهر في كل قائمة.
:hammer_and_wrench: | رابط المستودع | GitHub - merefield/discourse-tc-topic-list-previews: Enriches the content and layout of topic lists
:open_book: | دليل التثبيت | Installing a theme or theme component
:heart: | رعاية | يرجى التفكير في أن تصبح راعياً لعملي مفتوح المصدر بمستوى يناسب موارد واحتياجاتك أو مؤسستك لضمان حصول هذا المكون على الصيانة التي يستحقها ويستمر في العمل لموقعك في المستقبل.

هل تستمتع بهذا المكون السمة؟ يرجى :star: على GitHub

تثبيت مكون السمة هذا

يعمل بشكل جيد جدًا مع Discourse Bars 🍻 🍸 (a sidebar framework)!

نظرة عامة

تسمح لك معاينات قائمة الموضوعات بما يلي:

  • إضافة صور ومقتطفات وإحصائيات الموضوع إلى عناصر قائمة الموضوعات؛ و
  • تغيير تخطيط وأسلوب عناصر قائمة الموضوعات
  • إضافة موضوعات “مميزة” فوق قوائم الموضوعات والموضوعات.
  • إضافة جدار المستخدم إلى صفحة نشاط المستخدم (المعروفة أيضًا بميزة “الملف الشخصي”).

المكون الإضافي

يمكن استكمال هذا بـ المكون الإضافي “sidecar”: https://github.com/merefield/discourse-topic-previews-sidecar

لإضافة الميزات التالية:

  • “إجراءات” (وضع إشارة مرجعية، ربط، وإعجاب من قائمة الموضوعات)
  • منتقي الصور المصغرة في محرر بيانات التعريف للموضوع. (اختر أي صورة مصغرة من الموضوع بأكمله باستخدام واجهة مستخدم بسيطة)
  • تلوين الخلفية بناءً على اللون السائد للصورة المصغرة
  • معالجة الصور المصغرة لمقاطع YouTube لإزالة أي حدود سوداء (حاسم لتحديد أفضل لون سائد).
  • خيار إعادة إنشاء الصور المصغرة عند إعادة بناء منشور الموضوع للسماح لك بإدارة إزالة الحدود بسرعة على أساس موضوع فردي.

دليل تثبيت المكون الإضافي: Install plugins on a self-hosted site

تحتاج على الأقل إلى مكون السمة، والمكون الإضافي اختياري.

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

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

النمط الأساسي

الإعدادات ذات الصلة
  • صورة مصغرة لقائمة الموضوعات
  • مقتطف قائمة الموضوعات
  • إجراء قائمة الموضوعات

نمط Pinterest (Masonry) المعروف أيضًا باسم “البلاط”

الإعدادات ذات الصلة
  • بلاط قائمة الموضوعات
  • صورة مصغرة لقائمة الموضوعات
  • مقتطف قائمة الموضوعات
  • إجراء قائمة الموضوعات
  • عرض الصورة المصغرة لقائمة الموضوعات
  • ارتفاع الصورة المصغرة لقائمة الموضوعات

والذي يحتوي على خيار تنسيق واسع (خلف الإعداد topic_list_tiles_wide_format):

يعمل هذا بشكل متجاوب بحيث ينهار إلى تنسيق البلاط إذا لم يتم إعطاؤه عرضًا كافيًا (والعكس صحيح).

الصور المميزة

الإعدادات ذات الصلة
  • علامة الصور المميزة لقائمة الموضوعات
  • عدد الصور المميزة لقائمة الموضوعات
  • عرض الصور المميزة لقائمة الموضوعات
  • ارتفاع الصور المميزة لقائمة الموضوعات
  • عنوان الصور المميزة لقائمة الموضوعات
  • مقتطف الصور المميزة لقائمة الموضوعات
  • ترتيب الصور المميزة لقائمة الموضوعات

تبديل المقتطفات:

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

يمكنك استخدامه لـ TLP:

أمثلة في الواقع :seedling:

الدعم

لا أقدم أي دعم مضمون مجانًا. يمكنني تقديم الدعم للشركات أو المؤسسات التي تشترك في إحدى فئات الرعاية الشهرية الذهبية أو البلاتينية.

هناك أيضًا خيار إصلاح الأخطاء لمرة واحدة.

54 إعجابًا

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

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

3 إعجابات

علامة؟ لا، ولكن هناك هذا الخيار للترتيب حسب تاريخ الإنشاء:

image

إعجاب واحد (1)

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

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

حاليًا، التغيير موجود على فرع beta.

3 إعجابات

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

إعجابَين (2)

أنا أستخدم فقط الخيارات الأصلية المتاحة ضمن واجهة برمجة تطبيقات Discourse (إنها مكون سمة في جوهرها لذا لا يمكنك تغيير واجهة برمجة التطبيقات). عندما أحصل على فرصة، سألقي نظرة على الترتيب مرة أخرى. ومع ذلك، ظهر هذا منذ فترة ولقد أجريت تغييرًا لمساعدة أحد المستخدمين. Topic List Previews (legacy) - #1154 by merefield. أنا متفاجئ من أن هذا لا يعمل كما هو محدد. هل تتوقع أن يظل created_at للموضوع ثابتًا على الرغم من المشاركات الجديدة؟ هل أنت متأكد من أنك قمت بتغيير الإعداد وتحديث المتصفح؟

3 إعجابات

@raghukamath لقد اختبرت هذا للتو ويبدو أنه يعمل كما هو مقصود؟ لا يزال لن يغير الترتيب استجابةً للمشاركات الجديدة ويحترم تاريخ created_at. يرجى تحديث متصفحك وتجربته مرة أخرى.

3 إعجابات

لا مشكلة. سأقوم بالمزيد من الاختبارات. ربما كنت مرتبكًا بسبب السلوك عند تمكين الخيار. آسف لإزعاجك كثيرًا.

قضية أخرى أبرزها أعضائي هي حول عدم تطبيق إصلاح CSS الخاص بلون الموضوعات غير المقروءة والمقروءة على متصفحات الجوال.

إعجاب واحد (1)

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

مرحباً، كنت أحاول العمل مع المكون الإضافي المهمل الخاص بـ git عندما لم أتمكن من تجاوز CSS على الصورة المصغرة للجوال. استمر في العودة إلى ارتفاع 80 بكسل. بدأت في البحث ورأيت أنه تم نقله إلى المكون. هل سأواجه نفس المشكلة وأحتاج إلى استنساخ المكون لتغييره أم أن هناك حلاً بديلاً آخر؟ أريد أن يكون للجوال عرض كامل على متصفح الجوال.

هل التصميم هنا لن يناسب احتياجاتك: Topic List Previews (TLP) - #4 by merefield يناسب احتياجاتك؟ تتميز الصور المصغرة الجديدة بعرض كامل. هذا حاليًا على فرع beta. قم بتثبيته إذا كنت ترغب في ذلك كمكون سمة إضافي وجربه. تذكر تحديد الفرع عند التثبيت وتعديل اسم مكون السمة لجعله واضحًا أنه النسخة التجريبية.

إعجاب واحد (1)

هذا بالتأكيد سيفعل. لدي الآن العرض الكامل كما أردت. شكرا لك.

إعجاب واحد (1)

لقد قمت بدمج فرع beta:

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

مرحباً،

شكراً على هذه المكونة الرائعة! أحببت التصميم :heart_eyes:

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

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


^ هذه هي معاينة المكونة

إعجاب واحد (1)


^ هذه هي الطريقة التي تبدو بها عند تحميل الصفحة الحقيقية

الآن، أعتقد أن الأمر يتعلق بإعدادات الـ discourse الخاصة بي؟؟

هل هناك إعداد معين يجب تفعيله لكي تعمل هذه المكونة؟ أنا حقًا لا أعرف لماذا لا تعمل بالطريقة التي يجب أن تعمل بها…

مرحباً، شكراً لاهتمامك.

إليك بعض الأمور:

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

مرحباً روبرت،

شكراً على ردك! سأقوم باختبار ما اقترحته على موقعي :slight_smile:

إعجاب واحد (1)

مرحباً روبرت. أنا أحضر جدولاً ببرنامج جافا سكريبت طرف ثالث أسفل الرأس والبرنامج النصي يكسر المعاينات عندما أستخدمه في مكون. أي أفكار لحل بديل؟

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

إعجاب واحد (1)

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