Adding search tab - Thêm tab tìm kiếm

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
17,142
Được Like
12,745
Adding search tab - Thêm tab tìm kiếm

Chỉnh sửa Template:
Vào template header tìm:
Mã:
<xen:if is="{$canSearch}"><xen:include template="search_bar" /></xen:if>

Thay bằng:
Mã:
<xen:comment><xen:if is="{$canSearch}"><xen:include template="search_bar" /></xen:if></xen:comment>

Tiếp theo vào template navigation tìm:
Mã:
<!-- no selection -->
        <xen:if is="!{$selectedTab}">
            <li class="navTab selected"><div class="tabLinks"></div></li>
        </xen:if>

Chèn vào sau:
Mã:
        <xen:if is="{$canSearch}">
            <li class="navTab search Popup PopupControl PopupClosed">
    
                <a href="/search/" class="navLink NoPopupGadget" rel="Menu">{xen:phrase search}</a>
    
                <div class="Menu JsOnly tabMenu">
                    <xen:include template="search_bar" />
                </div>
            </li>
        </xen:if>

Vào template search_bar tìm:
Mã:
                        <div class="Popup" id="commonSearches">
                            <a rel="Menu" class="button NoPopupGadget Tooltip" title="{xen:phrase useful_searches}" data-tipclass="flipped"><span class="arrowWidget"></span></a>
                            <div class="Menu">
                                <div class="primaryContent menuHeader">
                                    <h3>{xen:phrase useful_searches}</h3>
                                </div>
                                <ul class="secondaryContent blockLinksList">
                                    <!-- block: useful_searches -->
                                    <li><a href="{xen:link find-new/threads, '', 'recent=1'}">{xen:phrase recent_threads}</a></li>
                                    <xen:if is="{$visitor.user_id}">
                                    <li><a href="{xen:link search/member, '', 'user_id={$visitor.user_id}', 'content=thread'}">{xen:phrase your_threads}</a></li>
                                    <li><a href="{xen:link search/member, '', 'user_id={$visitor.user_id}', 'content=post'}">{xen:phrase your_posts}</a></li>
                                    <li><a href="{xen:link search/member, '', 'user_id={$visitor.user_id}', 'content=profile_post'}">{xen:phrase your_profile_posts}</a></li>
                                    </xen:if>
                                    <!-- end block: useful_searches -->
                                </ul>
                            </div>
                        </div>

Thay bằng:
Mã:
                        <xen:comment><div class="Popup" id="commonSearches">
                            <a rel="Menu" class="button NoPopupGadget Tooltip" title="{xen:phrase useful_searches}" data-tipclass="flipped"><span class="arrowWidget"></span></a>
                            <div class="Menu">
                                <div class="primaryContent menuHeader">
                                    <h3>{xen:phrase useful_searches}</h3>
                                </div>
                                <ul class="secondaryContent blockLinksList">
                                    <!-- block: useful_searches -->
                                    <li><a href="{xen:link find-new/threads, '', 'recent=1'}">{xen:phrase recent_threads}</a></li>
                                    <xen:if is="{$visitor.user_id}">
                                    <li><a href="{xen:link search/member, '', 'user_id={$visitor.user_id}', 'content=thread'}">{xen:phrase your_threads}</a></li>
                                    <li><a href="{xen:link search/member, '', 'user_id={$visitor.user_id}', 'content=post'}">{xen:phrase your_posts}</a></li>
                                    <li><a href="{xen:link search/member, '', 'user_id={$visitor.user_id}', 'content=profile_post'}">{xen:phrase your_profile_posts}</a></li>
                                    </xen:if>
                                    <!-- end block: useful_searches -->
                                </ul>
                            </div>
                        </div></xen:comment>

Tìm:
Mã:
<div id="searchBar" class="pageWidth">

Thay bằng:
Mã:
<div id="searchBar">

Sau đó vào template search_bar.css tìm:
Mã:
    #QuickSearch
    {
        display: block;
        position: absolute;
        right: 20px;
        top: -18px;
        margin: 0;
        background-color: @content.background-color;
        border-radius: 5px;
        padding-top: 5px;
        _padding-top: 3px;
        z-index: 7500;
    }
    
        #QuickSearch .secondaryControls
        {
            display: none;
        }
        #QuickSearch.active
        {
            box-shadow: 5px 5px 25px rgba(0,0,0, 0.5);
            padding-bottom: 5px;
        }

Thay bằng:
Mã:
    #QuickSearch
    {
        display: block;
        margin: 0;
        background-color: @content.background-color;
        padding-top: 5px;
        _padding-top: 3px;
        z-index: 7500;
        float: left; /* Fix for the element not wrapping correctly */
    }

File modifications:
File: /js/xenforo/xenforo.js tìm:
Mã:
XenForo.QuickSearch=function(a){var b=0;a.find("#QuickSearchQuery").focus(function(){b++;console.log("Show quick search menu (%s)",b);b==1&&c.browser.msie&&c.browser.version<9&&a.find("input").keydown(function(a){if(a.keyCode==13)return c(this).parents("form").submit(),
!1});a.addClass("active");a.find(".secondaryControls").slideDown(0);c(h).bind("click",function(b){c(b.target).parents("#QuickSearch").length||(console.log("Hide quick search menu"),c(this).unbind(b),a.find(".secondaryControls").slideUp(XenForo.speed.xfast,function(){a.removeClass("active")}))})})};

Thay bằng:
Mã:
/*XenForo.QuickSearch=function(a){var b=0;a.find("#QuickSearchQuery").focus(function(){b++;console.log("Show quick search menu (%s)",b);b==1&&c.browser.msie&&c.browser.version<9&&a.find("input").keydown(function(a){if(a.keyCode==13)return c(this).parents("form").submit(),
!1});a.addClass("active");a.find(".secondaryControls").slideDown(0);c(h).bind("click",function(b){c(b.target).parents("#QuickSearch").length||(console.log("Hide quick search menu"),c(this).unbind(b),a.find(".secondaryControls").slideUp(XenForo.speed.xfast,function(){a.removeClass("active")}))})})};*/

Lưu ý: Điều này đã được thực hiện với style mặc định, mã template của bạn có thể sẽ khác nếu bạn sử dụng một style khác.

Kết quả:

example1.png

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


Nguồn: xenforo.com​
 

Top Bottom