Công cụ tìm kiếm nhanh trên thanh tiêu đề

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
Vnxf.vn - Đặt code trong EXTRA.css:

Mã:
/* START - QuickSearch in Header */
#QuickSearch {
top: -103px;
background-color: transparent;
}

#QuickSearch.active {
background: #176093; /* Old browsers */
background: -moz-linear-gradient(top,  #176093 0%, #60abf8 39%, #ffffff 80%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#176093), color-stop(39%,#60abf8), color-stop(80%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #176093 0%,#60abf8 39%,#ffffff 80%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #176093 0%,#60abf8 39%,#ffffff 80%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #176093 0%,#60abf8 39%,#ffffff 80%); /* IE10+ */
background: linear-gradient(to bottom,  #176093 0%,#60abf8 39%,#ffffff 80%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#176093', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.formPopup {
    background-color: transparent;
}

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveMediumWidth)
{
    .Responsive #QuickSearch
    {
        top: -18px;
    }
}
</xen:if>
/* END - QuickSearch in Header */

Kết quả là:

qs_closed.PNG

... Và khi hoạt động:

qs_active.PNG

Có bấy nhiêu thôi.

Để phù hợp trên thanh tiêu đề của bạn chỉ cần điều chỉnh các số ở đây:
Mã:
top: -103px;

Ngoài ra bạn có thể sử dụng Add-on QuickSearch in Header 1.1.1.

Nguồn: xenforo.com​
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mobile/Zalo: 0906081284

Telegram: anhanhxf

Chỉ nhận web nội dung lành mạnh

Nhà Tài Trợ

Mút Xốp Không Gian
Mút Sofa Không Gian
Top Bottom