Hướng dẫn Mod icon tuyệt đẹp cho Xenforo
Cách làm:
1. Download file đính kèm về
2. Giải nén ra up cả forder giải nén được lên ngang hàng với index.php
3. Vào Templates-->PAGE_CONTAINER chèn code sau trong thẻ <head>
Đây chính là thủ thuật
Tạo icon từ bộ Font Awesome bằng CSS
List icon bạn có thể sử dụng:
Để thêm icon các bạn vào Templates-->navigation_visitor_tab
và tìm các vị trí tương ứng:
Ví dụ: bạn tìm:
Đây chính là đoạn "Chi tiết Cá Nhân" trong ảnh demo:
để thêm icon thì bạn thêm
Vào trước
Ta được
Còn những cái khác bạn thêm tương tự như vậy
Chú ý: "icon-user" trong code thêm vào là mã của icon
Bạn có thể chọn icon tùy thích trên mấy ảnh trên để thay vào.
Demo:
Trước khi thêm icon
Sau khi thêm icon
Chúc các bạn thành công!!
Cách làm:
1. Download file đính kèm về
2. Giải nén ra up cả forder giải nén được lên ngang hàng với index.php
3. Vào Templates-->PAGE_CONTAINER chèn code sau trong thẻ <head>
Mã:
<link href="http://link của bạn/font-awesome/css/font-awesome.css" rel="stylesheet">Đây chính là thủ thuật
Tạo icon từ bộ Font Awesome bằng CSS
List icon bạn có thể sử dụng:
và tìm các vị trí tương ứng:
Ví dụ: bạn tìm:
Mã:
<xen:if is="{$canEditProfile}"><li><a href="{xen:link account/personal-details}">{xen:phrase personal_details}</a></li></xen:if>Đây chính là đoạn "Chi tiết Cá Nhân" trong ảnh demo:
để thêm icon thì bạn thêm
Mã:
<i class="icon-user icon-large icon-fixed-width" style="margin-right:1px;"></i>Vào trước
Mã:
{xen:phrase personal_details}Ta được
Mã:
<xen:if is="{$canEditProfile}"><li><a href="{xen:link account/personal-details}"><i class="icon-user icon-large icon-fixed-width" style="margin-right:1px;"></i>{xen:phrase personal_details}</a></li></xen:if>Còn những cái khác bạn thêm tương tự như vậy
Chú ý: "icon-user" trong code thêm vào là mã của icon
Bạn có thể chọn icon tùy thích trên mấy ảnh trên để thay vào.
Demo:
Trước khi thêm icon
Sau khi thêm icon
Chúc các bạn thành công!!
Nguồn: 4vnn.com
Bài viết liên quan
Bài viết mới
, update file đính kèm rồi á
