Hướng Dẫn làm User Info đẹp

mcjury · 02/01/2016

mà bác có code like giống của vnxf không code trượt kìa

mcjury · 02/01/2016

THB nói: ↑

đọc lại từ trên xuống dưới nha. demo vnxf luôn rồi. ko thì tìm addon của bác chủ thớt cài vào cho nhanh.
Click to expand...

như thế này đúng không

.messageUserBlock a.username text-align: center;

THB · 02/01/2016

mcjury nói: ↑

đã chỉnh sửa 4 lần
Click to expand...

làm thêm đi. hiii. 4 lần con số nhỏ quá. cố lên.

THB · 02/01/2016

mcjury nói: ↑

mà bác có code like giống của vnxf không code trượt kìa
Click to expand...

ko hiểu?

mcjury · 02/01/2016

cái đoạn này nè

Vào template message_user_info.css và thêm
Mã:
text-align: center;
vào các thẻ
Mã:
.messageUserBlock a.username
Mã:
.messageUserBlock .userTitle

Jindo_Katori · 17/01/2016

tuy ko dùng
nhưng dù sao cũng : tks for share.
à mà rất đẹp nhé

Trung Skyer · 28/01/2016

Sao của em lại như thế này

THB · 13/05/2016

làm sai bước
hiii

acaydanba · 19/05/2016

Oánh dấu, thanks chủ thớt

shynn nói: ↑

Ban đầu
View attachment 4061
Thành quả

Đầu tiên cần cài đặt Font Awesome trước.

Sau đó chúng ta vào Style Properties chỉnh theo như hình dưới
View attachment 4062

View attachment 4063
Xong rồi Update Style Properties

Tiếp theo mở template message_user_info

Tìm

Mã:

Thay bằng

Mã:

     



{xen:number $user.message_count}




{xen:number $user.like_count}




{xen:number $user.trophy_points}

-> Lưu

Vào template message_user_info.css và thêm

Mã:

text-align: center;

vào các thẻ

Mã:

.messageUserBlock a.username

Mã:

.messageUserBlock .userTitle

Mờ template Extra.css thêm vào để làm thành hình tròn

Mã:

.messageUserInfo .messageUserBlock .avatar > img { border-radius: 50%; }

.roundStats .fa {
    font-size: 30px;
    line-height: 37px;
    margin-left: -1px;
    margin-top: -1px;
    opacity: 0.25;
}
.roundStats .pairsInline {
    border: 1px solid #d5d5d5;
    border-radius: 100%;
    height: 36px;
    width: 36px;
}
.messageUserBlock .roundStats .roundTrophy { margin-left: 20px; overflow: hidden; }
.messageUserBlock .roundStats .roundLike { margin-left: 5px; overflow: hidden; }
.messageUserBlock .roundStats .roundMessage { margin-left: 20px; margin-top: -10px; overflow: hidden; }

.roundStats .pairsInline > dd {
    color: #000000;
    display: block;
    margin-top: -24px;
    text-align: center;
}
.messageUserInfo .extraUserInfo.roundStats {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    float: left;
    margin-left: -24px;
    margin-top: -2px;
    position: absolute;
}
.messageUserBlock .extraUserInfo { font-size: 11px; padding: 4px 6px; }

Giờ thêm tiếp đoạn code này vào Extra.css để thay cái vòng tròn online/offline

Mã:

/* PULSING INDICATOR */
.messageUserBlock div.avatarHolder .onlineMarker {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
    border: medium none !important;
    border-radius: 50% !important;
    display: inline-block;
    height: 16px;
    margin: 81px 0 0 107px;
    width: 16px;
}

.messageUserBlock div.avatarHolder .onlineMarker:before
{
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    margin: 3px 0 0 3px;
    background: #7fb900;
    border-color: #7fb900;
    border-radius: 50%
}

.messageUserBlock div.avatarHolder .onlineMarker:after
{
    content: '';
    position: absolute;
    width: 32px;
    height: 32px;
    margin: -9px 0 0 -9px;
    border: 1px solid #7fb900;
    border-radius: 50%;
    box-shadow: 0 0 4px #7fb900, inset 0 0 4px #7fb900;
    -webkit-transform: scale(0);
    -webkit-animation: online 2.5s ease-in-out infinite;
    animation: online 2.5s ease-in-out infinite
}

@-webkit-keyframes online
{
      0% {opacity: 1;-webkit-transform: scale(0)}
     50% {opacity: .7}
    100% {opacity: 0;-webkit-transform: scale(1)}
}

@keyframes online
{
      0% {opacity: 1;transform: scale(0)}
     50% {opacity: .7}
    100% {opacity: 0;transform: scale(1)}
}

Update thêm bỏ bớt mấy phần thừa lặp lại ở phía dưới
[IMG]

Bỏ tích những cái nào không cần

Xong

Nguồn: https://www.xfuniverse.com

Click to expand...

bui hung · 22/05/2016

mình muốn lấy file awsome.min.css đó về localhost thì khai đường dẫn như thế nào nhỉ ?
Mà sao 3 cái số avata trên vnxf to hơn số của mình ) của mình bé xíu khó nhìn quá

kieudai91 · 24/05/2016

thành quả của mình đây, nhìn không được đẹp cho lắm

hoccntt · 28/05/2016

shynn nói: ↑

Ban đầu
View attachment 4061
Thành quả

Click to expand...

Help ! Mình đã làm được nhưng sao không có cái hình mờ mờ ở 3 ô tròn nhỏ

Sau khi chỉnh không thấy hình mờ nhỏ

Nhờ ae chỉnh giúp cảm ơn

bui hung · 28/05/2016

đọc trang 2 là có hướng dẫn đó bạn ơi sao ko chịu đọc

tx101 · 30/05/2016

Nhờ giúm chỉnh sửa lại giùm mình là bài viết, được thích, điểm thành tích chuyển xướng phía dưới như forum mình đc không ạ, còn phía trên avatar thì bỏ hết chỉ để hình avatar hình tròn thôi và dấu online

THB · 26/06/2016

sao ta? ko hiểu?
xem #13 thử

utmaster90 · 06/07/2016

sao ben minh ko giong ben vnxf nhi~ ??

THB · 06/07/2016

làm chưa đúng. hiii

datdaik000 · 06/07/2016

THB nói: ↑

làm chưa đúng. hiii
Click to expand...

ahihi :3

utmaster90 · 06/07/2016

chua dung cho nao chi minh voi

datdaik000 · 06/07/2016

utmaster90 nói: ↑

chua dung cho nao chi minh voi
Click to expand...

cài font awesome vào.

Support	Quảng cáo
Mr. San (PVS)	Mr. Bình (THB)
Mr. Tuấn 0988 488 096	Mr. Bình 0981 06 08 08
kinhdoanh@vnxf.vn

Đăng nhập

Hướng Dẫn làm User Info đẹp

mcjury Thượng Đế

mcjury Thượng Đế

THB Admin - Founder Thành viên BQT

THB Admin - Founder Thành viên BQT

mcjury Thượng Đế

Jindo_Katori Thượng Đế

Trung Skyer Thượng Đế

THB Admin - Founder Thành viên BQT

acaydanba Thượng Đế

bui hung Thượng Đế

kieudai91 Thượng Đế

hoccntt Thượng Đế

bui hung Thượng Đế

tx101 Thượng Đế

THB Admin - Founder Thành viên BQT

utmaster90 Thượng Đế

Các file đính kèm:

xsaxa.JPG

THB Admin - Founder Thành viên BQT

datdaik000 Thượng Đế

utmaster90 Thượng Đế

datdaik000 Thượng Đế

Chia sẻ trang này

Thông tin chung

VNXF OPEN

LIÊN KẾT

LIÊN KẾT

XenForo 1	XenForo 2
Translate by PVS

Đăng nhập

Hướng Dẫn làm User Info đẹp

mcjury Thượng Đế

mcjury Thượng Đế

THB Admin - Founder Thành viên BQT

THB Admin - Founder Thành viên BQT

mcjury Thượng Đế

Jindo_Katori Thượng Đế

Trung Skyer Thượng Đế

THB Admin - Founder Thành viên BQT

acaydanba Thượng Đế

bui hung Thượng Đế

kieudai91 Thượng Đế

hoccntt Thượng Đế

bui hung Thượng Đế

tx101 Thượng Đế

THB Admin - Founder Thành viên BQT

utmaster90 Thượng Đế

Các file đính kèm:

xsaxa.JPG

THB Admin - Founder Thành viên BQT

datdaik000 Thượng Đế

utmaster90 Thượng Đế

datdaik000 Thượng Đế

Chia sẻ trang này

Tìm kiếm hữu ích