في كثير من منتديات vBulletin، يتم تمييز المواضيع غير المقروءة افتراضيًا عبر جعل عنوان الموضوع بخط عريض فقط، وهذا أحيانًا لا يكون كافيًا—خصوصًا في الأقسام التي تحتوي على عدد كبير من المواضيع أو عند تصفّح المنتدى بسرعة. لذلك، تأتي فكرة إضافة شارة “غير مقروءة” كحل بسيط لكنه فعّال، يجعل حالة الموضوع واضحة فورًا ويمنح المستخدم تجربة تصفّح أكثر تنظيمًا وراحة.
في هذا الشرح سأوضح طريقة إضافة إشارة غير مقروءة داخل قائمة المواضيع وقائمة الأقسام بأسلوب مميز وجذاب، بحيث تظهر الشارة في نهاية العنوان بطريقة أنيقة دون التأثير على أداء المنتدى أو شكل القالب. الطريقة متوافقة مع vBulletin الجيل الخامس والسادس وتعمل حتى آخر الإصدارات (حسب المعاينة)، ويمكنك تطبيقها بسهولة عبر إضافة الأكواد المطلوبة كما هو موضح بالأسفل مع رابط التحميل.
في هذا الشرح سأوضح طريقة إضافة إشارة غير مقروءة داخل قائمة المواضيع وقائمة الأقسام بأسلوب مميز وجذاب، بحيث تظهر الشارة في نهاية العنوان بطريقة أنيقة دون التأثير على أداء المنتدى أو شكل القالب. الطريقة متوافقة مع vBulletin الجيل الخامس والسادس وتعمل حتى آخر الإصدارات (حسب المعاينة)، ويمكنك تطبيقها بسهولة عبر إضافة الأكواد المطلوبة كما هو موضح بالأسفل مع رابط التحميل.
أضف شارة "غير مقروءة" إلى عرض قائمة المواضيع
بشكل افتراضي، تعرض المواضيع غير المقروءة في عرض الموضوع العنوان بخط غامق. ولجعلها أكثر وضوحًا، يمكنك إضافة شارة "غير مقروءة" في نهاية العنوان.
اضف الكود التالي في CSS في css_additional من خيارات تعديل الموقع ومن ثم الستيال ومن ثم CSS:
CSS:
/* Unread Badge on Topic View - START */
.topic-list-container .topic-list .topic-item:not(.read) .cell-topic .topic-wrapper .topic-title:after {
content: 'Unread';
background: red;
color: #fff;
font-size: 10px;
padding: 1px 3px;
border-radius: 3px;
margin-left: 5px;
filter: drop-shadow(1px 1px 2px #333);
vertical-align: super;
}
/* Unread Badge on Topic View - END */إضافة اشارة المنتدى غير المقروءة
افتراضيًا، تعرض المنتديات غير المقروءة في قائمة المنتدى رمز الفقاعة التفسيرية باللون الأزرق بينما تعرض منتديات القراءة رمز الفقاعة التفسيرية باللون الرمادي. ولجعلها أكثر وضوحًا، يمكنك إضافة شارة "غير مقروءة" في نهاية عنوان المنتدى.
اضف الكود التالي في CSS في css_additional من خيارات تعديل الموقع ومن ثم الستيال ومن ثم CSS
CSS:
/* Unread Forum Badge - START */
.forum-wrapper .b-icon__speech-double-large--blue ~ .forum-title::after,
.forum-wrapper .b-icon__channel-icon:not(.b-icon__channel-icon--read) ~ .forum-title::after {
content: 'Unread';
background: red;
color: #fff;
font-size: 10px;
padding: 1px 3px;
border-radius: 3px;
margin-left: 5px;
filter: drop-shadow(1px 1px 2px #333);
vertical-align: super;
white-space: nowrap;
text-decoration: none;
display: inline-block;
}
.forum-list-container .forum-item .cell-forum > .forum-wrapper> .forum-info > .forum-title {
display: inline;
}
/* Unread Forum Badge - END */