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

PVS

Super Moderator
Thành viên BQT
Code hoặc hướng dẫn này được sử dụng trên phiên bản Xenforo cũ đã quá hạn sử dụng. Bạn hãy click để tìm bản mới hơn
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​
 
Back
Top