User Group Styling - Cấu hình style cho nhóm

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,688
Việc cài đặt mã màu xenforo cho nhóm thành viên được phân ra 2 mục: user titles và user names. Ví dụ user titles của bạn là Member và username là namnhi.
Và bạn cũng có thể cấu hình màu riêng biệt cho nhóm Staff qua class css .staff cho phép hiển thị cho Administrator và các Moderators.
Cụ thể như sau:
User Group Styling

Nếu thành viên thuộc nhiều user group khác nhau, bạn có thể thiết đặt thông số Display Styling Priority để ưu tiên hiển thị theo nhóm nào.

display-styling-priority.png

(Trị số càng lớn, nhóm đó càng được ưu tiên hiển thị)

User name và User titles sẽ hiển thị ở những khu vực sau:
  • Staff Online Now block in the sidebar
  • Message user info in posts and conversations
  • Conversation Participants block in the sidebar
  • Member list
  • Current visitors
Ngoài ra, cấu hình của chúng cũng hiển thị ở đây:

  • Dropdown menu under the user name on the navigation bar
  • Member card
  • Profile page
User Name Styling

Để cấu hình hiển thị cho Username, chèn mã css của bạn vào User Name CSS trong usergroup settings. Ví dụ đổi màu nhóm Administrator thành đỏ:
Mã:
color:red;

user-name-basic-css.png

Trong post view:

mui-block-user-name-basic-styling.png

Hoặc chèn thêm icon cho Username:
Mã:
background: transparent url('đường dẫn đến ico của bạn') no-repeat;
padding-left: 20px;
color: red;

user-name-advanced-css.png

Sẽ được như thế này:

mui-block-user-name-advanced-styling.png

User Title Styling

Để cấu hình cho User Title, bạn phải thiết lập User Title Override thành Use the following user title. Thiết đặt như hình:

user-title-basic-css.png

Bạn sẽ được:

mui-block-user-title-basic-styling.png

Lưu ý: mặc định xenforo chỉ cho phép tối đa 100 kí tự trong ô User Title Override bao gồm cả thẻ span và css của bạn.
Để khắc phục điều này, bạn có thể cho usertitle của bạn vào trong thẻ div và cấu hình css trong template EXTRA.css

user-title-advanced-css.png

Đặt code sau vào cuối template EXTRA.css
Mã:
.custom-title-admin {
background-color: @primaryMedium;
border: 1px solid @primaryDarker;
border-radius: 4px;
padding: 4px;
margin: 4px 0;
text-align: center;
color: white;
}

.sidebar .custom-title-admin {
margin-left: 43px;
max-width: 80px;
}

Ta sẽ được:

mui-block-user-title-advanced-styling.png

Sidebar Display - Hiển thị màu username trong sidebar

Để hiển thị chính xác màu username trong sidebar(Staff Online NowMembers Online Now), bạn cần phải edit template sidebar_online_users:
Tìm:
Mã:
class="username{xen:if '!{$user.visible}', ' invisible'}{xen:if {$user.followed}, ' followed'}">{$user.username},

Thay bằng:
Mã:
class="username{xen:if '!{$user.visible}', ' invisible'}{xen:if {$user.followed}, ' followed'}">{xen:helper richUserName, $user},

staff-members-online-now.png

Staff Styling

Để cấu hình màu sắc riêng cho bài viết của user thuộc nhóm Staff, chèn đoạn sau vào cuối template EXTRA.css:
Mã:
.staff {
color: @primaryMedium;
}

staff-message-text.png

Có thể chỉnh màu khác nếu thích!
Sau đây là 1 số thông số mẫu bạn có thể thay đổi cho phù hợp với diễn đàn của mình:
Post background
Mã:
.staff .messageContent { background-color: @primaryLighterStill; }

staff-message-background.png

Message user block
Mã:
.staff .messageUserBlock { background-color: @primaryLightish; }

staff-mui-block-basic.png

Avatar holder
Mã:
.staff .avatarHolder { background-color: @primaryLighter !important; } .staff .messageUserBlock { background-color: @primaryLightish; border-color: @primaryLightish; } .staff .messageUserBlock .arrow { border-left-color: @primaryLightish; } .staff .messageUserBlock .arrow span { border-left-color: @primaryLighter; }

staff-mui-block-advanced.png

Tổng hợp tất cả các css trên ta được:

staff-styling.png



Nguồn: dulieutinhoc.com​
 

ducmu

Corporal
Tham gia
24/06/2015
Bài viết
151
Được Like
36
nich admin của mình nó có cái khung "staff member". làm sao để đổi thành "thành viên BTQ"?
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,688
vào phrase tìm Staff Member và sửa lại theo ý bạn
 

ducmu

Corporal
Tham gia
24/06/2015
Bài viết
151
Được Like
36
vào phrase tìm Staff Member và sửa lại theo ý bạn
1.cái staff member này chỉ có vs nhóm admin thôi hả a? tại e set 1 nich là mod mà ko thấy có
2. xenforo chỉ có admin vs mod thôi hả a? ko có super mod(quản lý chung các box) như vbb nhỉ?
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,688
1. bạn phải tích vào ô display staff ở nick mà bạn set Mod nữa nha
2. bạn có thể tự add thêm mà, rồi sau đó qua liên kết Moderator và click vào set Super Mod là được mà
 

VinhHung

Private
Tham gia
21/08/2015
Bài viết
39
Được Like
3
1. bạn phải tích vào ô display staff ở nick mà bạn set Mod nữa nha
2. bạn có thể tự add thêm mà, rồi sau đó qua liên kết Moderator và click vào set Super Mod là được mà
cái mà chèn icon vào ấy toi chèn 1 hình mà nó có 1 nữa à
upload_2015-9-4_11-47-26.png
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,688
nó có giới hạn của nó nha bạn, bạn vượt quá thì phải chịu thôi
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,688
anh @Minh Bảo giúp bạn ấy giúp em với, chứ em cũng chưa hiểu code bạn ấy ra sao mà như vậy nữa
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,688
cả 2 đều không có nha
 

Klul

Nghèo + xấu trai + không tiền :)
Tham gia
09/08/2015
Bài viết
93
Được Like
82
Vậy cái này thì sao :)
rank x.jpg
 

Jindo_Katori

FirstSergeant
Tham gia
01/03/2015
Bài viết
1,462
Được Like
1,205
Trong này thiếu cái bảng này thì chỉnh chỗ nào bác @PVS
 

Đính kèm

  • Screen Shot 2016-03-08 at 9.28.02 PM.png
    Screen Shot 2016-03-08 at 9.28.02 PM.png
    754.3 KB · Lượt xem: 27

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mr. Tuấn

Mobile/Zalo: 0988 488 096

Telegram: bluekpro

Email: [email protected]

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Top Bottom