Hướng dẫn Tạo user banner của riêng bạn dành cho các nhóm user

Thảo luận trong 'Tips and Guides' bắt đầu bởi Blue, 30/07/2017.

  • Google checker:
  1. Blue

    Blue Admin - Founder Thành viên BQT

    Tham gia:
    25/02/2015
    Bài viết:
    767
    Đã được thích:
    1,183
    Điểm thành tích:
    93
    Giới tính:
    Nam
    Nếu bạn đã từng cài một diễn đàn mã nguồn XenForo cho riêng mình thì điều chỉnh các nhóm user luôn khiến bạn trăn trở, làm sao để các thành viên cảm thấy vui vẻ khi nhìn thấy nick của họ, làm sao để tên của họ hiện lên thật đẹp và khác biệt chỉ có ở site của bạn, trong đó việc dùng user banner cũng là một cách để tạo ấn tượng, khi điều chỉnh 1 user group bạn sẽ biết user banner là gì :) Mặc định XenForo có một số mẫu cho bạn chọn, nếu muốn tạo user banner của riêng bạn dành cho các nhóm user thì hãy xem hướng dẫn bên dưới.

    Trước khi thực hiện, bạn cần cho các user banner bằng một cái tên (dùng chữ và số dính liền hoặc dấu _, không sử dụng dấu tiếng Việt và các ký tự lạ khác), và nên nhớ tên css này phải ko trùng với css khác.

    Ở ô nhập trong ảnh của bạn bạn nhập là: css_banner_1 (có thể đặt tên khác). Sau đó vào EXTRA.css nhập đoạn bên dưới vào (chú ý chữ css_banner_1 chính là chữ bạn nhập vào ở phần chỉnh user banner). Xem hình minh họa ở dưới, bạn hãy check ô Other, using custom css class name và nhập vào đó nhé.

    tao user banner cua rieng ban danh cho cac nhom user.jpg

    Mã:
    .css_banner_1 {
        font-size: 11px; /*Cỡ chữ*/
        color: black; /*Màu chữ, đang là màu đen*/
        background-color: yellow; /*Màu nền, đang là màu vàng*/
        border-color: #E0E000; /*Màu viền, đang là màu vàng đậm*/
        background: transparent url('styles/default/xenforo/gradients/form-button-white-25px.png') repeat-x top; /*Màu nền gradient, bạn có thể bỏ nếu muốn*/
        padding: 1px 5px;
        border: 1px solid transparent;
        border-radius: 3px;
        box-shadow: 1px 1px 3px rgba(0,0,0, 0.25);
        text-align: center;
    }
    Về màu sắc có 2 cách để nhập:
    1. Bạn dùng các tên gọi màu sắc bằng tiếng Anh (ví dụ: white, green, purple, brown, pink...).
    2. Dùng mã có dạng #...... (ví dụ: #ffffff. #000000, #cccccc...), dạng này không phân biệt chữ hoa chữ thường. Bạn có thể vào đây để tìm mã màu khác: Hãy đăng nhập hoặc đăng ký để xem được links

    Bài hướng dẫn chỉ dành cho ai không rành css nhé, nếu bạn biết rồi thì rất đơn giản. Chúc các bạn thử nghiệm thành công!

    Blue - VNXF
     
    Tags:
    THB thích bài này.
  2. cuumotsach

    cuumotsach Thượng Đế

    Tham gia:
    29/07/2017
    Bài viết:
    4
    Đã được thích:
    2
    Điểm thành tích:
    3
    Cảm ơn rất nhiều ạ.
     
    THB thích bài này.
Tags:

Chia sẻ trang này

Đang tải...