Tutorial 2x Banner Rank - Tùy chỉnh banner xếp hạng cho XenForo 2

Thảo luận trong 'Tips and Guides' bắt đầu bởi PVS, 12/06/2018.

  • Google checker:
  1. PVS

    PVS Cộng Sự Đặc Biệt Thành viên BQT

    Tham gia:
    28/02/2015
    Bài viết:
    9,352
    Đã được thích:
    6,232
    Điểm thành tích:
    113
    Giới tính:
    Nam
    Nghề nghiệp:
    SV
    Nơi ở:
    Huế
    Banner Rank - Tùy chỉnh banner xếp hạng cho XenForo 2

    Trước tiên, hãy thêm đoạn mã này vào template Extra.less:
    Mã:
    /* common banner codes */
    [class*='trgamersafis_'] {font-family:'Exo';border-left: 3px solid rgba(0, 0, 0, 0.2);margin-top: 3px;text-align: center;height: 20px;line-height: 15px;position: relative;max-width: 180px;padding: 2px 20px 2px 15px;user-select: none;color: #FFFFFF;font-size: 11px;font-weight: normal;}
    [class*='trgamersafis_'] strong:before {font-family: "FontAwesome";background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0;position: absolute;top: 0;bottom: 0;left: 0;padding: 2px 4px 0px 4px;min-width: 15px;font-size: 100%;text-align: center;}
    [class*='trgamersafis_'] strong {margin-left: 15px;}
    
    /* custom banner codes for user group */
    .trgamersafis_00 {background: #8e0909;border-color: #8e0909;box-shadow: 0 0 15px #8e0909, inset 0 0 20px white;}.trgamersafis_00 strong:before {content: "\f27e";}
    .trgamersafis_01 {background: #1C86EE;border-color: #1C86EE;box-shadow: 0 0 15px #1C86EE, inset 0 0 20px white;}.trgamersafis_01 strong:before {content: "\f132";}
    .trgamersafis_02 {background: #176093;border-color: #176093;box-shadow: 0 0 15px #176093, inset 0 0 20px white;}.trgamersafis_02 strong:before {content: "\f132";}
    .trgamersafis_03 {background: #14bd61;border-color: #14bd61;box-shadow: 0 0 15px #14bd61, inset 0 0 20px white;}.trgamersafis_03 strong:before {content: "\f0e7";}
    .trgamersafis_04 {background: #17713c;border-color: #17713c;box-shadow: 0 0 15px #17713c, inset 0 0 20px white;}.trgamersafis_04 strong:before {content: "\f0e7";}
    .trgamersafis_05 {background: #8F343A;border-color: #8F343A;box-shadow: 0 0 15px #8F343A, inset 0 0 20px white;}.trgamersafis_05 strong:before {content: "\f044";}
    .trgamersafis_06 {background: #4ca79b;border-color: #4ca79b;box-shadow: 0 0 15px #4ca79b, inset 0 0 20px white;}.trgamersafis_06 strong:before {content: "\f0d6";}
    .trgamersafis_07 {background: #8E44AD;border-color: #8E44AD;box-shadow: 0 0 15px #8E44AD, inset 0 0 20px white;}.trgamersafis_07 strong:before {content: "\f2b5";}
    .trgamersafis_08 {background: #FFBE1C;border-color: #FFBE1C;box-shadow: 0 0 15px #FFBE1C, inset 0 0 20px white;}.trgamersafis_08 strong:before {content: "\f234";}
    .trgamersafis_09 {background: #CF4D35;border-color: #CF4D35;box-shadow: 0 0 15px #CF4D35, inset 0 0 20px white;}.trgamersafis_09 strong:before {content: "\f007";}
    .trgamersafis_10 {background: #000000;border-color: #000000;box-shadow: 0 0 15px #000000, inset 0 0 20px white;}.trgamersafis_10 strong:before {content: "\f235";}
    .trgamersafis_11 {background: #202020;border-color: #202020;box-shadow: 0 0 15px #202020, inset 0 0 20px white;}.trgamersafis_11 strong:before {content: "\f06e";}
    Sau đó, thêm đoạn code sau vào user group ở field (Other, using custom CSS class name)
    Thêm theo thứ tự:
    trgamersafis_00 cho nhóm đầu tiên,
    trgamersafis_01 cho nhóm thứ hai, v.v.

    Kết quả:

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


    Nguồn: xenforo.com​
     
    secpol thích bài này.
  2. BinSaker

    BinSaker Thượng Đế

    Tham gia:
    21/07/2016
    Bài viết:
    246
    Đã được thích:
    84
    Điểm thành tích:
    28
    Giới tính:
    Nam
    Nghề nghiệp:
    ở đợ
    Nơi ở:
    308 Canal St New York
    ước gì xen1 có :D
     

Chia sẻ trang này

Đang tải...