آموزش : متفاوت کردن و رنگ دادن به گروه های کاربری

[وحید نامنی 12154]

اگر می خواهید که گروه های کاربری که در انجمن تون وجود دارند را به طور متفاوت چیزی همانند شکل زیر کنید به سادگی امکان پذیر است. شما با خواندن این آموزش در صورت آشنایی اولیه با CSS و HTML قادر خواهید بود افکت های خاص خود را ایجاد نمایید.
 

شما در بخش مدیریت گروه های کاربری قادر خواهید بود که تمامی دسترسی ها و تنظیمات مربوط به گروه های کاربری را انجام دهید.

Members  >	 Member Groups  >	Manage Member Groups

گروه کاربری مورد نظرتون رو ویرایش کنید.

Group Icon Image : در این بخش آدرس تصویری را که می خواهید نماد این گروه باشد وارد نمایید. مانند شکل زیر :

Group Formatting Prefix : کد وارده از طرف شما قبل از نام کاربری نمایش می یابد
Group Formatting Suffix : کد وارده از طرف شما بعد از گروه کاربری نمایش می یابد.

اگر شما چنین وارد نمایید :

Group Formatting Prefix :

<span style='color:red;'>

Group Formatting Suffix :

</span>

نام کاربری های این گروه اینگونه نمایش خواهند یافت :
 

نام گروه کاربری

اگر چیزی همانند شکل ابتدای پست می خواهید گروه های کاربری خود را تغییر شکل دهید ابتدا کد های زیر را درون CSS انجمن قرار دهید.

برای اینکار ابتدا به پنل مدیریت بروید و سپس مسیر به Look & Feel . قالب مورد نظر خود را انتخاب و روی Manage Templates & CSS کلیک نمایید. سپس روی CSS زده و فایل ipb_styles.css را انتخاب نمایید.
 

http://ipsfarsi.com/index.php?app=core&module=attach&section=attach&attach_rel_module=post&attach_id=481

و در انتهای این فایل کد های زیر را قرار دهید :

.userMember {
color: white;
background: #31B404;
height: 26px;
line-height: 26px;
padding: 0 5px;
font-size: 11px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
display: inline-block;
}

.userValidating, .userGuest {
color: white;
background: #EFEFEF;
height: 26px;
line-height: 26px;
padding: 0 5px;
font-size: 11px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
display: inline-block;
}
.userManagement {
color: white;
background: #D70000;
height: 26px;
line-height: 26px;
padding: 0 5px;
font-size: 11px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
display: inline-block;
}

.userStaff {
color: white;
background: #D59944;
height: 26px;
line-height: 26px;
padding: 0 5px;
font-size: 11px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
display: inline-block;
}

.userCustomer {
color: white;
background: #8904B1;
height: 26px;
line-height: 26px;
padding: 0 5px;
font-size: 11px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
display: inline-block;
} 

نکته : در قسمت color کد رنگ مورد نظر و در قسمت background کد رنگ مورد نظر برای تغییر پس زمینه نام کاربری را می توانید طبق دلخواه خود تغییر دهید.

حالا در قسمت گروه های کاربری کد های زیر را وارد نمایید.

طبق کد های این آموزش برای گروه مدیریت این کد را قرار دهید ( Prefix قبل و Suffix بعد ):
 

Prefix: <span class="userManagement">
Suffix: </span>

مدیران :
 

Prefix: <span class="userStaff">
Suffix: </span>

مشتریان ( در این انجمن IPB User ) :

Prefix: <span class="userCustomer">
Suffix: </span>

کابران مهمان :
 

Prefix: <span class="userValidating">
Suffix: </span>

کاربران عادی :
 

Prefix: <span class="userMember">
Suffix: </span>

--------

برای اعمال رنگ بندی در تمام بخش های انجمن از مد Group Color on User Link باید استفاده نمایید.

موفق باشید.
سوالات خود را در این آموزش در بخش پشتیبانی عمومی مطرح فرمایید.