رفتن به مطلب
ای پی بورد ایران

Image Description از تمامی ویژگی های منحصر بفرد سیستم بهره ببرید!!!

شعبان زاده

آموزش کادر بندی مشخصات کاربری

Recommended Posts

با سلام 

برای کادر بندی مشخصات ابتدا وارد این آدرس شوید 

Look & Feel  >  Manage Skin Sets & Templates  

سپس بر روی قالب مورد نظر خود کلیک کنید 

در صفحه باز شده از قسمت بالایی css را انتخاب کنید و در صفحه جدید بر روی  ipb_styels.css کلیک کنید 

حال باید یک کد css برای ایجاد کادربندی بسازیم 

بنده یک نمونه کد را به صورت اماده قرار می دهم این کد مناسب قالب های روشن است 

/********************************************************/
/* Post info bit										*/
.invisionpower_Button {
	cursor: default;
width: 165px;
line-height: 30px;
font-size: 13px;
word-wrap: break-word;
padding: 00px;
margin: 2px 0px;
background: #f6f6f6;
background: -moz-linear-gradient(top,#f6f6f6 0%,#e5e5e5 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#f6f6f6),color-stop(100%,#e5e5e5));
border: 1px solid #dbdbdb;
-moz-box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3);
-webkit-box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3);
box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
color: #616161;
display: inline-block;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-box-shadow: inset rgba(0,0,0,0.25) 0px 0px 0px 1px;
-moz-box-shadow: inset rgba(0,0,0,0.25) 0px 0px 0px 1px;
box-shadow: inset rgba(0,0,0,0.25) 0px 0px 0px 1px;
}

سپس از قسمت templateها وارد user info pane شوید 

و حالا کافی است است class های بخش ها را تغییر دهید 

به صورت مثال برای کادر دادن به اواتار این عبارت را جست وجو کنید 

<li class='avatar'>

و تغییر دهید به

<li class='invisionpower_Button'>

به هیمن صورت بخش ها را پیدا کنید و عبارت بعد از li را تغییر دهید 

نکته:این کار را می توانید به شکل دیگری و با تغییر کد های دیگری انجام دهید اما این ساده ترین راه است

یک نمونه کد برای قالب های تیره نیر اماده کرده ام 

برای استفاده از قالب های تیره از این کد css استفاده کنید 

/********************************************************/
/* Post info bit                                        */
.invisionpower_Button {
cursor: default;
width: 165px;
line-height: 30px;
font-size: 13px;
word-wrap: break-word;
padding: 00px;
margin: 2px 0px;
background: #0D0D0D;
background: -moz-linear-gradient(top,#f6f6f6 0%,#e5e5e5 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#0D0D0D),color-stop(100%,#474646));
border: 1px solid #736363;
-moz-box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3);
-webkit-box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3);
box-shadow: 0px 1px 0px rgba(255,255,255,1) inset,0px 1px 0px rgba(0,0,0,0.3);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
color: #616161;
display: inline-block;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-box-shadow: inset rgba(0,0,0,0.25) 0px 0px 0px 1px;
-moz-box-shadow: inset rgba(0,0,0,0.25) 0px 0px 0px 1px;
box-shadow: inset rgba(0,0,0,0.25) 0px 0px 0px 1px;
color: #fff;
}

موفق باشید

  • Upvote 1

به اشتراک گذاشتن این پست


لینک به پست
اشتراک در سایت های دیگر

ایجاد یک حساب کاربری و یا به سیستم وارد شوید برای ارسال نظر

کاربر محترم برای ارسال نظر نیاز به یک حساب کاربری دارید.

ایجاد یک حساب کاربری

ثبت نام برای یک حساب کاربری جدید در انجمن ها بسیار ساده است!

ثبت نام کاربر جدید

ورود به حساب کاربری

در حال حاضر می خواهید به حساب کاربری خود وارد شوید؟ برای ورود کلیک کنید

ورود به سیستم

×