Làm đẹp cho Sidebar Tab

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
17,149
Được Like
12,745
Làm đẹp cho Sidebar Tab

Bài viết sẽ hướng dẫn các bạn cách làm đẹp cho Sidebar Tab.
Yêu cầu: Diễn đàn của bạn phải cài đặt add-on Widget Framework

Demo:

image.jpg

Bước 1: Thêm vào template EXTRA.css đoạn code sau:
Mã:
.tabs {border-bottom: 0px;}
.widget-tabs .tabs {  margin-top: 10px; padding: 0 0 0 17px;}
.widget-tabs .tabs li {  margin-right: 8px;}
.widget-tabs .tabs li.active a, .widget-tabs .tabs.noLinks li.active {
    border-bottom: 1px solid rgb(213, 218, 225);
    color: #136cc5;
}
@media (max-width: @maxResponsiveNarrowWidth) {
.widget-tabs .tabs li {  float: left;}
}

Bước 2: Vào Appearence >> List widgets >> Add widgets
Thêm đoạn code sau vào Title
Mã:
<span class="fa fa-smile-o fa-lg Tooltip" title="Nội dung"></span>
Quan trọng nhất bạn cần phải chú ý:
1. Set nhiều Widget với title ký tự vào cùng 1 Group ở Widget Group
2. Thay đoạn ký hiệu icon vào "fa-smile-o" theo ý muốn của bạn
3. Sửa "Nội dung" thành nội dung bạn muốn hiển thị
Ví dụ:

image (1).jpg

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


Nguồn: vnnet.org​
 

THB

Founder
Thành viên BQT
Tham gia
25/02/2015
Bài viết
6,651
Được Like
3,934
xấu hoắc. haaaaaaaa
 

Top Bottom