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

Thảo luận trong 'Tips and Guides' bắt đầu bởi PVS, 25/02/2016.

  • 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,293
    Đã được thích:
    6,218
    Điểm thành tích:
    113
    Giới tính:
    Nam
    Nghề nghiệp:
    SV
    Nơi ở:
    Huế
    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​
     
    Bài viết mới
    Cần Hỗ Trợ Styles MTNews
    Cần Hỗ Trợ Styles MTNews bởi bitdoan, 20/09/2018 lúc 21:49:41
    Tags:
    dadad, TD2308, Lê Tí and 3 others like this.
  2. smallant

    smallant Thượng Đế

    Tham gia:
    10/08/2015
    Bài viết:
    20
    Đã được thích:
    9
    Điểm thành tích:
    3
    Giới tính:
    Nữ
    Thanks kiu. Quá đẹp.
     
  3. Switch9400

    Switch9400 Thượng Đế

    Tham gia:
    03/12/2015
    Bài viết:
    9
    Đã được thích:
    4
    Điểm thành tích:
    3
    Giới tính:
    Nam
    like
    chèn ảnh động nhấp nháy vào luôn thì quá ảo
     
    quocbit thích bài này.
  4. quocbit

    quocbit Thượng Đế

    Tham gia:
    25/02/2017
    Bài viết:
    4
    Đã được thích:
    2
    Điểm thành tích:
    3
    đường dẫn style là gì z
     
  5. secpol

    secpol Thượng Đế

    Tham gia:
    10/06/2016
    Bài viết:
    144
    Đã được thích:
    94
    Điểm thành tích:
    28
    Giới tính:
    Nam
    Nghề nghiệp:
    Health Care
    Nơi ở:
    HN
    Bạn dùng style nào thì temp của style đó sủa thôi.
     
  6. ducga

    ducga Thượng Đế

    Tham gia:
    30/10/2015
    Bài viết:
    22
    Đã được thích:
    4
    Điểm thành tích:
    3
    Giới tính:
    Nam
    @PVS vậy anh có thể hướng dẫn em làm đẹp tiền tố như này không ạ, demo: Hãy đăng nhập hoặc đăng ký để xem được links
     
  7. cafesoida

    cafesoida Thượng Đế

    Tham gia:
    29/06/2018
    Bài viết:
    31
    Đã được thích:
    3
    Điểm thành tích:
    8
    Nơi ở:
    Hà Nội
  8. dinhhai

    dinhhai Thượng Đế

    Tham gia:
    28/07/2015
    Bài viết:
    393
    Đã được thích:
    196
    Điểm thành tích:
    43
    Giới tính:
    Nam
    Nơi ở:
    hcm
    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ỉ?
     
  9. PVS

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

    Tham gia:
    28/02/2015
    Bài viết:
    9,293
    Đã được thích:
    6,218
    Điểm thành tích:
    113
    Giới tính:
    Nam
    Nghề nghiệp:
    SV
    Nơi ở:
    Huế
    Ở 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.
     
  10. dinhhai

    dinhhai Thượng Đế

    Tham gia:
    28/07/2015
    Bài viết:
    393
    Đã được thích:
    196
    Điểm thành tích:
    43
    Giới tính:
    Nam
    Nơi ở:
    hcm
    Mình đã làm được theo post này của bác Hãy đăng nhập hoặc đăng ký để xem được links
    Cảm ơn bác @PVS
     
    Chỉnh sửa cuối: 14/09/2018

Chia sẻ trang này

Đang tải...