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

[ XF 2.2 ] كود لعمل بنرات جميلة لمجموعات المستخدم

النوميدي

:: الأعضاء ::
3 أبريل 2020
206
124
43
أرض الله
www.techawzen.com
2v0sIpz.png


الحــــمــــد للـــه رب العـــالمــين والــصلاة والســـلام على أشـــرف الخـلق والمـرســلين
خـــير خــلق اللـه ســيدنـا محــمــد عــليـــه أفضـــل الصـــلاة وأتـــم التســــليم
،
أعـــضاء المــنتدى الكــــــــــــــرام
أســــــعد اللــه أوقـاتكــــم

،،
يطــيب لي أن أقـــدم لكـــم اليوم كود جميل لإضافــة بنرات روعة للمجموعات الخاصة بالأعضاء

النتيجة بعد إضافة الكود
afis-banner-trgamers.png
كل ما علينا هو التوجع الى قالب
extra.less

و نضيف الكواد التالي في أسفل القالب
CSS:
/* Afiş genel kodları */
[class*='trgamersafis_'] {font-family:'Play';border-left: 3px solid rgba(0, 0, 0, 0.2);margin-top: 3px;text-align: center;height: 20px;line-height: 15px;position: relative;max-width: 180px;padding: 2px 20px 2px 15px;user-select: none;color: #FFFFFF;font-size: 11px;font-weight: normal;}
[class*='trgamersafis_'] strong:before {font-family:Font Awesome\ 5 Pro,Font Awesome\ 5 Brands;background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0;position: absolute;top: 0;bottom: 0;left: 0;padding: 2px 4px 0px 4px;min-width: 15px;font-size: 100%;text-align: center;}
[class*='trgamersafis_'] strong {margin-left: 15px;}

/* Afiş kodları */
.trgamersafis_00 {background: #8e0909;border-color: #8e0909;box-shadow: 0 0 15px #8e0909, inset 0 0 20px white;}.trgamersafis_00 strong:before {content: "\f27e";}
.trgamersafis_01 {background: #1C86EE;border-color: #1C86EE;box-shadow: 0 0 15px #1C86EE, inset 0 0 20px white;}.trgamersafis_01 strong:before {content: "\f132";}
.trgamersafis_02 {background: #176093;border-color: #176093;box-shadow: 0 0 15px #176093, inset 0 0 20px white;}.trgamersafis_02 strong:before {content: "\f132";}
.trgamersafis_03 {background: #14bd61;border-color: #14bd61;box-shadow: 0 0 15px #14bd61, inset 0 0 20px white;}.trgamersafis_03 strong:before {content: "\f0e7";}
.trgamersafis_04 {background: #17713c;border-color: #17713c;box-shadow: 0 0 15px #17713c, inset 0 0 20px white;}.trgamersafis_04 strong:before {content: "\f0e7";}
.trgamersafis_05 {background: #8F343A;border-color: #8F343A;box-shadow: 0 0 15px #8F343A, inset 0 0 20px white;}.trgamersafis_05 strong:before {content: "\f3d1";}
.trgamersafis_06 {background: #4ca79b;border-color: #4ca79b;box-shadow: 0 0 15px #4ca79b, inset 0 0 20px white;}.trgamersafis_06 strong:before {content: "\f5b9";}
.trgamersafis_07 {background: #8E44AD;border-color: #8E44AD;box-shadow: 0 0 15px #8E44AD, inset 0 0 20px white;}.trgamersafis_07 strong:before {content: "\f2b5";}
.trgamersafis_08 {background: #F5780D;border-color: #F5780D;box-shadow: 0 0 15px #F5780D, inset 0 0 20px white;}.trgamersafis_08 strong:before {content: "\f4fc";}
.trgamersafis_09 {background: #CF4D35;border-color: #CF4D35;box-shadow: 0 0 15px #CF4D35, inset 0 0 20px white;}.trgamersafis_09 strong:before {content: "\f007";}
.trgamersafis_10 {background: #000000;border-color: #000000;box-shadow: 0 0 15px #000000, inset 0 0 20px white;}.trgamersafis_10 strong:before {content: "\f235";}
.trgamersafis_11 {background: #202020;border-color: #202020;box-shadow: 0 0 15px #202020, inset 0 0 20px white;}.trgamersafis_11 strong:before {content: "\f06e";}
نحفظ القالب و نتجه الى المجموعات و التراخيص ثم مجموعات المستخدم و نختار المجموعة التي سنضيف لها البنر
و نختار "أخرى، باستخدم نمط CSS مخصص" و نضيف مثلا "trgamersafis_10"
Capture.JPG

إذا ما كان الستايل عندك أبيض أو فاتح و لم يعجبك التأثير على البنرات كل ما عليك هو التعديل
على القيمة في دالة inset و shadow

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

تحياتي العطـــــرة
 
جميل جدا تسلم ايدك
2v0sIpz.png


الحــــمــــد للـــه رب العـــالمــين والــصلاة والســـلام على أشـــرف الخـلق والمـرســلين
خـــير خــلق اللـه ســيدنـا محــمــد عــليـــه أفضـــل الصـــلاة وأتـــم التســــليم
،
أعـــضاء المــنتدى الكــــــــــــــرام
أســــــعد اللــه أوقـاتكــــم

،،
يطــيب لي أن أقـــدم لكـــم اليوم كود جميل لإضافــة بنرات روعة للمجموعات الخاصة بالأعضاء

النتيجة بعد إضافة الكود
مشاهدة المرفق 4759
كل ما علينا هو التوجع الى قالب
extra.less

و نضيف الكواد التالي في أسفل القالب
CSS:
/* Afiş genel kodları */
[class*='trgamersafis_'] {font-family:'Play';border-left: 3px solid rgba(0, 0, 0, 0.2);margin-top: 3px;text-align: center;height: 20px;line-height: 15px;position: relative;max-width: 180px;padding: 2px 20px 2px 15px;user-select: none;color: #FFFFFF;font-size: 11px;font-weight: normal;}
[class*='trgamersafis_'] strong:before {font-family:Font Awesome\ 5 Pro,Font Awesome\ 5 Brands;background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0;position: absolute;top: 0;bottom: 0;left: 0;padding: 2px 4px 0px 4px;min-width: 15px;font-size: 100%;text-align: center;}
[class*='trgamersafis_'] strong {margin-left: 15px;}

/* Afiş kodları */
.trgamersafis_00 {background: #8e0909;border-color: #8e0909;box-shadow: 0 0 15px #8e0909, inset 0 0 20px white;}.trgamersafis_00 strong:before {content: "\f27e";}
.trgamersafis_01 {background: #1C86EE;border-color: #1C86EE;box-shadow: 0 0 15px #1C86EE, inset 0 0 20px white;}.trgamersafis_01 strong:before {content: "\f132";}
.trgamersafis_02 {background: #176093;border-color: #176093;box-shadow: 0 0 15px #176093, inset 0 0 20px white;}.trgamersafis_02 strong:before {content: "\f132";}
.trgamersafis_03 {background: #14bd61;border-color: #14bd61;box-shadow: 0 0 15px #14bd61, inset 0 0 20px white;}.trgamersafis_03 strong:before {content: "\f0e7";}
.trgamersafis_04 {background: #17713c;border-color: #17713c;box-shadow: 0 0 15px #17713c, inset 0 0 20px white;}.trgamersafis_04 strong:before {content: "\f0e7";}
.trgamersafis_05 {background: #8F343A;border-color: #8F343A;box-shadow: 0 0 15px #8F343A, inset 0 0 20px white;}.trgamersafis_05 strong:before {content: "\f3d1";}
.trgamersafis_06 {background: #4ca79b;border-color: #4ca79b;box-shadow: 0 0 15px #4ca79b, inset 0 0 20px white;}.trgamersafis_06 strong:before {content: "\f5b9";}
.trgamersafis_07 {background: #8E44AD;border-color: #8E44AD;box-shadow: 0 0 15px #8E44AD, inset 0 0 20px white;}.trgamersafis_07 strong:before {content: "\f2b5";}
.trgamersafis_08 {background: #F5780D;border-color: #F5780D;box-shadow: 0 0 15px #F5780D, inset 0 0 20px white;}.trgamersafis_08 strong:before {content: "\f4fc";}
.trgamersafis_09 {background: #CF4D35;border-color: #CF4D35;box-shadow: 0 0 15px #CF4D35, inset 0 0 20px white;}.trgamersafis_09 strong:before {content: "\f007";}
.trgamersafis_10 {background: #000000;border-color: #000000;box-shadow: 0 0 15px #000000, inset 0 0 20px white;}.trgamersafis_10 strong:before {content: "\f235";}
.trgamersafis_11 {background: #202020;border-color: #202020;box-shadow: 0 0 15px #202020, inset 0 0 20px white;}.trgamersafis_11 strong:before {content: "\f06e";}
نحفظ القالب و نتجه الى المجموعات و التراخيص ثم مجموعات المستخدم و نختار المجموعة التي سنضيف لها البنر
و نختار "أخرى، باستخدم نمط CSS مخصص" و نضيف مثلا "trgamersafis_10"
مشاهدة المرفق 4760

إذا ما كان الستايل عندك أبيض أو فاتح و لم يعجبك التأثير على البنرات كل ما عليك هو التعديل
على القيمة في دالة inset و shadow

إلى شرح جديد نترككم في امان الله و حفظه
 

إحصائيات المنتدى

المواضيع
1,563
المشاركات
17,666
الأعضاء
1,113
آخر عضو مسجل
AhmedMohammed
أعلى