Làm đẹp tiền tố (Prefix) cho Xenforo

  • Thread starter Thread starter PVS
  • Ngày gửi Ngày gửi
[VNXF] Theme Digital – Sự lựa chọn hoàn hảo cho diễn đàn công nghệ hiện đại

PVS

Super Moderator
Thành viên BQT
Làm đẹp tiền tố (Prefix) cho Xenforo

Bài viết hướng dẫn cách làm đẹp prefix cho Xenforo.

N0GrQLl.png

Bước 1: Vào AdminCP tạo vài Prefix
Bước 2: Tạo một ít chủ đề mới có dùng Prefix
Bước 3: Vào template thread_prefixes.css của style bạn đang dùng và thay hết bằng code sau:
Mã:
.prefix
{
    background-color: transparent;
padding-right: 10px;
padding-left: 10px;
-webkit-border-radius: 2px; -moz-border-radius: 2px; -khtml-border-radius: 2px; border-radius: 2px;
display: inline-block;
line-height: 20px;

}

a.prefixLink:active
{
    text-decoration: none;
}

a.prefixLink:active .prefix
{
    text-decoration: none;

}

.prefix a { color: inherit; }

.prefix.prefixPrimary    { color: white; background-color: #BAEBF1; border-color: rgb(236, 236, 236); }
.prefix.prefixSecondary  { color: white; background-color: #F0BEAE; border-color: #f9d9b0; }

.prefix.prefixRed        { color: white; background-color: #EB6B6B; border-color: #F88; }
.prefix.prefixGreen      { color: white; background-color: #7cc085; border-color: green; }
.prefix.prefixOlive      { color: white; background-color: #c1df4b; border-color: olive; }
.prefix.prefixLightGreen { color: white; background-color: #98e2a1; border-color: lightgreen; }
.prefix.prefixBlue       { color: white; background-color: #00adec; border-color: #88F; }
.prefix.prefixRoyalBlue  { color: white; background-color: #916bd2; border-color: #81A9E1;  }
.prefix.prefixSkyBlue    { color: white; background-color: #80d8ff; border-color: skyblue; }
.prefix.prefixGray       { color: white; background-color: #c1ced9; border-color: #AAA; }
.prefix.prefixSilver     { color: white; background-color: #d7e0e7; border-color: silver; }
.prefix.prefixYellow     { color: white; background-color: #f9d42f; border-color: #E0E000; }
.prefix.prefixOrange     { color: white; background-color: #f1ae37; border-color: #FFC520; }

.discussionListItem .prefix,
.searchResult .prefix
{
    font-size: 80%;
margin: 0 7px 0 0;

 
    font-weight: normal;
}

h1 .prefix
{
    font-size: 80%;
margin: 0 7px 0 0;

    vertical-align: text-top;
}

.breadcrumb span.prefix,
.heading span.prefix
{
    margin: 0;
border: 0 none black;

}

Lưu lại là xong.

Chúc các bạn thành công.


Nguồn: mamcongnghe.com​
 
Hiện tại mặc định tiền tố có được mấy cái, giờ mình muốn thêm ít màu nữa (tím, hồng,...) thì thêm vào đâu bác @PVS nhỉ?
 
Ở mục tạo prefix, bạn có thể sử dụng css nhập vào ô "Other, using custom CSS class name:" để tùy chỉnh thêm nha.
 
Back
Top