هيلبرنت | Helpernt - تغيير رتب الاعضاء وتحويلها الى مكتبة الخطوط Font Awesome

هيلبرنت | Helpernt (https://www.helpernt.com/vb/index.php)

- ركن تطوير منتديات vb3.8.0 (https://www.helpernt.com/vb/forumdisplay.php?f=99)

تغيير رتب الاعضاء وتحويلها الى مكتبة الخطوط Font Awesome

السلام عليكم ورحمة الله وبركاته

في اغلب الاحيان تكون رتب الاعضاء عبارة عن نجوم او ما شابهها وكلها تكون من الصور او بمعنى ادق الايقونات ودرسنا اليوم بسيط وهو تحويلها رتب الاعضاء من ايقونات الى مكتبه خطوط Font Awesome فنرجو المتابعه معنا
الشرح
1- من لوحة تحكم المنتدى >> رتب الاعضاء >> اضافة رتبة جديدة >> قم بتغير مايلزم طبقا لما تريدها لكن سيتبقى فقط خانه الكود اللى سيتم وضعه فيها وهى خانه HTMLl كما بالصورة

https://www.helpernt.com/vb/attachme...1&d=1522006978

- في تلك الخانة نضع هذا الكود

كود:

<div class="ranks fa fa-star"></div>

- ثم نضغط على حفظ ونقوم بتحديث رتب الاعضاء كما بالصورة

https://www.helpernt.com/vb/attachme...1&d=1522006978

- نختار تحديث ألقاب الاعضاء كما بالصورة

https://www.helpernt.com/vb/attachme...1&d=1522006978

- يتبقى كود Css نذهب الى Css رئيسى اسفلها ستجد مربع اسمه تعاريف CSS الإضافية/Additional CSS Definitions كما بالصوره

https://www.helpernt.com/vb/attachme...1&d=1522006978

نضع الكود التالى به

كود:

.ranks {

    font-size: 0.69em;

    font-weight: lighter;

    line-height: 16px;

    color: #F3981E;

    border: 1px solid #F3BD38;

    box-shadow: 0px 0px 3px #F3BD38;

    background: rgb(255,204,77) none repeat scroll 0% 0%;

}

- ثم حفظ
النتيجة

https://www.helpernt.com/vb/attachme...1&d=1522006978