وضع الاسم المستعار داخل مربع ( css)

الحمزاوي

عضو جديد
7 ديسمبر 2010
87
2
0
السلام عليكم ورحمة الله أيها الأحبة ..

مصادفة كنت أتجول في موقع أجنبي , وجدت فكرة جميلة لوضع الاسم المستعار ضمن قالب Postbit_legacy بشكل جميل وخفيف ولا يؤثر على سرعة التصفح , ومتوافق مع المتصفحات , كما يمكنك التغيير عليه ليلائم إستايل منتداك .


معاينة التأثير :
مباشرة

أو صورة توضيحية /

mFXQx.png



شرح /
نقوم أولا بوضع كود css في تعاريف الإضافية في نهاية الإستايل المراد التعديل عليه /

9dUIe.png


الكود
كود:
.postbitbox
{
        background-color: #ececec;
    border-top: solid 2px #fff; 
        border-left: solid 4px #BBC7CE; 
        border-right: solid 4px #BBC7CE; 
        border-bottom: solid 2px #fff;
        padding:2px;
        color:#000000;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        -khtml-border-radius: 5px;
        -moz-box-shadow: 0 0 6px #979797;  
        -webkit-box-shadow: 0 0 6px #979797;
        box-shadow: 0 0 6px #979797;
}

ثانيا / بالبحث عن القوالب , أبحث عن قالب Postbit_legacy , ونبحث فيه عن الكود التالي :
كود:
<div id="postmenu_$post[postid]">

نستبدله بهذا الكود :

كود:
<div id="postmenu_$post[postid]" align="center">

ونضيف بعدها مباشرة :

كود:
<div class="postbitbox">

ZEeNC.png


ثالثا / وفي نفس القالب نبحث عن الكود :

كود:
$post[skypeicon]</div>
            </div>

نضيف قبلها /

كود:
</div>


ختاما / هذا العمل جهد شخصي ومن شرحي نأمل حفظ الحقوق لملتقى كلمة الثقافي .
هوامش /
1- تم التعديل على قالب البوست بيت لاجسي الافتراضي لنسخة الفي بي .
2- يمكنك التغير على المربع حول الاسم من خلال كود السي اس اس ليلائم إستايل منتداك وألوانه.

ود + تحايا
أخوكم / أحمد الحمزاوي

المصدر