Request Nhờ các bác!

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Em rất muốn có 2 thứ trên xen
1. Menu top ở trên cùng
2. Cái slider chạy chạy ở phía dưới.
Mong các bác hướng dẫn giúp em với ạ. Thanks billion!

upload_2018-3-28_12-48-58.png
 
  • Like
Reactions: THB

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Không biết đề xuất trợ giúp của mình có gì không phù hợp với chuyên mục không nữa,nhưng vẫn kiên trì mong đợi tin hồi âm!
 
  • Like
Reactions: THB

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Cảm ơn Admin @Blue rất nhiều, em đã đọc bài đó, copy nguyên cả code này
<script type="text/javascript" src="http://vnxf.vn/js/jquery.jsticky.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#header").sticky({
top: 0,
zIndex: 11111111
});
});
</script>
dán vào template footer nhưng nav không lên trên cùng, em thay cả cái "#header" thành "navigation" hoặc .classheader. cũng không được admin ạ. Giúp em hướng dẫn kỹ hơn tí nữa nhé admin. Thanks admin!
 

Blue

Founder
Thành viên BQT
Tham gia
25/02/2015
Bài viết
909
Được Like
1,528
Bạn làm được rồi à, vừa vô thấy nó đã sticky.
Thêm css bên dưới cho menu dưới ẩn đi nữa là chuẩn:

.navTabs .navTab.selected .tabLinks {display:none!important}
 

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Bạn làm được rồi à, vừa vô thấy nó đã sticky.
Thêm css bên dưới cho menu dưới ẩn đi nữa là chuẩn:

.navTabs .navTab.selected .tabLinks {display:none!important}
Thanks admin rất nhiều, em muốn cái thanh đó nó lên trên cùng ý ạ (Trên cả cái logo và chữ MANG TƯ LIỆU ĐẾN TẬN BÀN LÀM VIỆC CỦA BẠN).
 

f0rest

MasterCorporal
Tham gia
22/04/2015
Bài viết
309
Được Like
198
Muốn cho cái menu đó lên top thì bạn có thể làm như sau:
Vào style template -> header và thay bằng đoạn code phía dưới và Save lại
Mã:
<xen:edithint template="header.css" />

<xen:hook name="header">
<div id="header">
    <xen:include template="navigation" />
    <xen:include template="logo_block" />
    <xen:if is="{$canSearch}"><xen:include template="search_bar" /></xen:if>
</div>
</xen:hook>

Tiếp theo, bạn vào template navigation, và thay bằng đoạn code này rồi Save lại
Mã:
<xen:edithint template="navigation.css" />

<div id="navigation">
    <div class="pageContent">
        <nav>

<div class="navTabs">
    <ul class="publicTabs">
    
        <!-- home -->
        <xen:if is="{$showHomeLink}">
            <li class="navTab home PopupClosed"><a href="{$homeLink}" class="navLink">{xen:phrase home}</a></li>
        </xen:if>
        
        
        <!-- extra tabs: home -->
        <xen:if is="{$extraTabs.home}">
        <xen:foreach loop="$extraTabs.home" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
            
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
                
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>
        
        
        <!-- forums -->
        <xen:if is="{$tabs.forums}">
            <li class="navTab forums {xen:if $tabs.forums.selected, 'selected'}">
            
                <a href="{$tabs.forums.href}" class="navLink">{$tabs.forums.title}</a>
                <a href="{$tabs.forums.href}" class="SplitCtrl" rel="Menu"></a>                               
            </li>
        </xen:if>
        
        
        <!-- extra tabs: middle -->
        <xen:if is="{$extraTabs.middle}">
        <xen:foreach loop="$extraTabs.middle" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
            
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
                
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>
        
        
        <!-- members -->
        <xen:if is="{$tabs.members}">
            <li class="navTab members {xen:if $tabs.members.selected, 'selected'}">
            
                <a href="{$tabs.members.href}" class="navLink">{$tabs.members.title}</a>
                <a href="{$tabs.members.href}" class="SplitCtrl" rel="Menu"></a>
                
                
            </li>
        </xen:if>               
        
        <!-- extra tabs: end -->
        <xen:if is="{$extraTabs.end}">
        <xen:foreach loop="$extraTabs.end" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
            
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
                
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>

        <!-- responsive popup -->
        <li class="navTab navigationHiddenTabs Popup PopupControl PopupClosed" style="display:none">   
                        
            <a rel="Menu" class="navLink NoPopupGadget"><span class="menuIcon">{xen:phrase menu}</span></a>
            
            <div class="Menu JsOnly blockLinksList primaryContent" id="NavigationHiddenMenu"></div>
        </li>
            
        
        <!-- no selection -->
        <xen:if is="!{$selectedTab}">
            <li class="navTab selected"><div class="tabLinks"></div></li>
        </xen:if>
        
    </ul>
    
    <xen:if is="{$visitor.user_id}"><xen:include template="navigation_visitor_tab" /></xen:if>
</div>

<span class="helper"></span>
            
        </nav>   
    </div>
</div>


Sau đó vào Properties của style để chỉnh lại độ dài rộng và thuộc tính cho cái navigation đó là xong
 

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Muốn cho cái menu đó lên top thì bạn có thể làm như sau:
Vào style template -> header và thay bằng đoạn code phía dưới và Save lại
Mã:
<xen:edithint template="header.css" />

<xen:hook name="header">
<div id="header">
    <xen:include template="navigation" />
    <xen:include template="logo_block" />
    <xen:if is="{$canSearch}"><xen:include template="search_bar" /></xen:if>
</div>
</xen:hook>

Tiếp theo, bạn vào template navigation, và thay bằng đoạn code này rồi Save lại
Mã:
<xen:edithint template="navigation.css" />

<div id="navigation">
    <div class="pageContent">
        <nav>

<div class="navTabs">
    <ul class="publicTabs">
   
        <!-- home -->
        <xen:if is="{$showHomeLink}">
            <li class="navTab home PopupClosed"><a href="{$homeLink}" class="navLink">{xen:phrase home}</a></li>
        </xen:if>
       
       
        <!-- extra tabs: home -->
        <xen:if is="{$extraTabs.home}">
        <xen:foreach loop="$extraTabs.home" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>
       
       
        <!-- forums -->
        <xen:if is="{$tabs.forums}">
            <li class="navTab forums {xen:if $tabs.forums.selected, 'selected'}">
           
                <a href="{$tabs.forums.href}" class="navLink">{$tabs.forums.title}</a>
                <a href="{$tabs.forums.href}" class="SplitCtrl" rel="Menu"></a>                              
            </li>
        </xen:if>
       
       
        <!-- extra tabs: middle -->
        <xen:if is="{$extraTabs.middle}">
        <xen:foreach loop="$extraTabs.middle" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>


        </xen:foreach>
        </xen:if>
       
       
        <!-- members -->
        <xen:if is="{$tabs.members}">
            <li class="navTab members {xen:if $tabs.members.selected, 'selected'}">
           
                <a href="{$tabs.members.href}" class="navLink">{$tabs.members.title}</a>
                <a href="{$tabs.members.href}" class="SplitCtrl" rel="Menu"></a>
               
               
            </li>
        </xen:if>              
       
        <!-- extra tabs: end -->
        <xen:if is="{$extraTabs.end}">
        <xen:foreach loop="$extraTabs.end" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>

        <!-- responsive popup -->
        <li class="navTab navigationHiddenTabs Popup PopupControl PopupClosed" style="display:none">  
                       
            <a rel="Menu" class="navLink NoPopupGadget"><span class="menuIcon">{xen:phrase menu}</span></a>
           
            <div class="Menu JsOnly blockLinksList primaryContent" id="NavigationHiddenMenu"></div>
        </li>
           
       
        <!-- no selection -->
        <xen:if is="!{$selectedTab}">
            <li class="navTab selected"><div class="tabLinks"></div></li>
        </xen:if>
       
    </ul>
   
    <xen:if is="{$visitor.user_id}"><xen:include template="navigation_visitor_tab" /></xen:if>
</div>

<span class="helper"></span>
           
        </nav>  
    </div>
</div>


Sau đó vào Properties của style để chỉnh lại độ dài rộng và thuộc tính cho cái navigation đó là xong
Em THỬ ngay và LUÔN! Cảm ơn trước!
 

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Tuyệ
Muốn cho cái menu đó lên top thì bạn có thể làm như sau:
Vào style template -> header và thay bằng đoạn code phía dưới và Save lại
Mã:
<xen:edithint template="header.css" />

<xen:hook name="header">
<div id="header">
    <xen:include template="navigation" />
    <xen:include template="logo_block" />
    <xen:if is="{$canSearch}"><xen:include template="search_bar" /></xen:if>
</div>
</xen:hook>

Tiếp theo, bạn vào template navigation, và thay bằng đoạn code này rồi Save lại
Mã:
<xen:edithint template="navigation.css" />

<div id="navigation">
    <div class="pageContent">
        <nav>

<div class="navTabs">
    <ul class="publicTabs">
   
        <!-- home -->
        <xen:if is="{$showHomeLink}">
            <li class="navTab home PopupClosed"><a href="{$homeLink}" class="navLink">{xen:phrase home}</a></li>
        </xen:if>
       
       
        <!-- extra tabs: home -->
        <xen:if is="{$extraTabs.home}">
        <xen:foreach loop="$extraTabs.home" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>
       
       
        <!-- forums -->
        <xen:if is="{$tabs.forums}">
            <li class="navTab forums {xen:if $tabs.forums.selected, 'selected'}">
           
                <a href="{$tabs.forums.href}" class="navLink">{$tabs.forums.title}</a>
                <a href="{$tabs.forums.href}" class="SplitCtrl" rel="Menu"></a>                              
            </li>
        </xen:if>
       
       
        <!-- extra tabs: middle -->
        <xen:if is="{$extraTabs.middle}">
        <xen:foreach loop="$extraTabs.middle" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>
       
       
        <!-- members -->
        <xen:if is="{$tabs.members}">
            <li class="navTab members {xen:if $tabs.members.selected, 'selected'}">
           
                <a href="{$tabs.members.href}" class="navLink">{$tabs.members.title}</a>
                <a href="{$tabs.members.href}" class="SplitCtrl" rel="Menu"></a>
               
               
            </li>
        </xen:if>              
       
        <!-- extra tabs: end -->
        <xen:if is="{$extraTabs.end}">
        <xen:foreach loop="$extraTabs.end" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>

        <!-- responsive popup -->
        <li class="navTab navigationHiddenTabs Popup PopupControl PopupClosed" style="display:none">  
                       
            <a rel="Menu" class="navLink NoPopupGadget"><span class="menuIcon">{xen:phrase menu}</span></a>
           
            <div class="Menu JsOnly blockLinksList primaryContent" id="NavigationHiddenMenu"></div>
        </li>
           
       
        <!-- no selection -->
        <xen:if is="!{$selectedTab}">
            <li class="navTab selected"><div class="tabLinks"></div></li>
        </xen:if>
       
    </ul>
   
    <xen:if is="{$visitor.user_id}"><xen:include template="navigation_visitor_tab" /></xen:if>
</div>

<span class="helper"></span>
           
        </nav>  
    </div>
</div>


Sau đó vào Properties của style để chỉnh lại độ dài rộng và thuộc tính cho cái navigation đó là xong[/QUOTuyee
Muốn cho cái menu đó lên top thì bạn có thể làm như sau:
Vào style template -> header và thay bằng đoạn code phía dưới và Save lại
Mã:
<xen:edithint template="header.css" />

<xen:hook name="header">
<div id="header">
    <xen:include template="navigation" />
    <xen:include template="logo_block" />
    <xen:if is="{$canSearch}"><xen:include template="search_bar" /></xen:if>
</div>
</xen:hook>

Tiếp theo, bạn vào template navigation, và thay bằng đoạn code này rồi Save lại
Mã:
<xen:edithint template="navigation.css" />

<div id="navigation">
    <div class="pageContent">
        <nav>

<div class="navTabs">
    <ul class="publicTabs">
   
        <!-- home -->
        <xen:if is="{$showHomeLink}">
            <li class="navTab home PopupClosed"><a href="{$homeLink}" class="navLink">{xen:phrase home}</a></li>
        </xen:if>
       
       
        <!-- extra tabs: home -->
        <xen:if is="{$extraTabs.home}">
        <xen:foreach loop="$extraTabs.home" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>
       
       
        <!-- forums -->
        <xen:if is="{$tabs.forums}">
            <li class="navTab forums {xen:if $tabs.forums.selected, 'selected'}">
           
                <a href="{$tabs.forums.href}" class="navLink">{$tabs.forums.title}</a>
                <a href="{$tabs.forums.href}" class="SplitCtrl" rel="Menu"></a>                              
            </li>
        </xen:if>
       
       
        <!-- extra tabs: middle -->
        <xen:if is="{$extraTabs.middle}">
        <xen:foreach loop="$extraTabs.middle" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>
       
       
        <!-- members -->
        <xen:if is="{$tabs.members}">
            <li class="navTab members {xen:if $tabs.members.selected, 'selected'}">
           
                <a href="{$tabs.members.href}" class="navLink">{$tabs.members.title}</a>
                <a href="{$tabs.members.href}" class="SplitCtrl" rel="Menu"></a>
               
               
            </li>
        </xen:if>              
       
        <!-- extra tabs: end -->
        <xen:if is="{$extraTabs.end}">
        <xen:foreach loop="$extraTabs.end" key="$extraTabId" value="$extraTab">
            <xen:if is="{$extraTab.linksTemplate}">
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                <a href="{$extraTab.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$extraTab.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} {$extraTabId}TabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$extraTab.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    {xen:raw $extraTab.linksTemplate}
                </div>
            </li>
            <xen:else />
                <li class="navTab {$extraTabId} {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}<xen:if is="{$extraTab.counter}"><strong class="itemCount"><span class="Total">{$extraTab.counter}</span><span class="arrow"></span></strong></xen:if></a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>

        <!-- responsive popup -->
        <li class="navTab navigationHiddenTabs Popup PopupControl PopupClosed" style="display:none">  
                       
            <a rel="Menu" class="navLink NoPopupGadget"><span class="menuIcon">{xen:phrase menu}</span></a>
           
            <div class="Menu JsOnly blockLinksList primaryContent" id="NavigationHiddenMenu"></div>
        </li>
           
       
        <!-- no selection -->
        <xen:if is="!{$selectedTab}">
            <li class="navTab selected"><div class="tabLinks"></div></li>
        </xen:if>
       
    </ul>
   
    <xen:if is="{$visitor.user_id}"><xen:include template="navigation_visitor_tab" /></xen:if>
</div>

<span class="helper"></span>
           
        </nav>  
    </div>
</div>


Sau đó vào Properties của style để chỉnh lại độ dài rộng và thuộc tính cho cái navigation đó là xong
 

f0rest

MasterCorporal
Tham gia
22/04/2015
Bài viết
309
Được Like
198
Tuyệt admin @

Tuyệt ạ, nó đã lên trên nhưng nó lại không cố định thôi a ạ!
Vậy, bạn có thể thêm đoạn code này vào ngay trên đầu của template navigation.css
Mã:
#navigation
{
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 999999999;
}
 

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Đã thành công tuyệt tác, cảm ơn admin rất nhiều, còn mỗi cái chỗ này nữa, cũng mong admin giúp đỡ nốt thì tốt quá ạ, đó là em nhúng được cái ô tìm kiếm tài liệu (màu vàng) vào thanh navbar rồi nhưng nó cứ lệch lên trên, em dùng mấy cú pháp &nbsp;&nbsp;..... nhưng không xuống giữa được admin ạ. @f0rest !
 

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Bạn làm được rồi à, vừa vô thấy nó đã sticky.
Thêm css bên dưới cho menu dưới ẩn đi nữa là chuẩn:

.navTabs .navTab.selected .tabLinks {display:none!important}
Thuộc tính none này là nó biến mất thanh submenu, có thuộc tính nào để khi đưa chuột vào thanh navigation thì nó tự động hiển thị submenu này không anh. Cảm ơn anh rất nhiều!
 

phamquangquyen

Private
Tham gia
22/01/2018
Bài viết
45
Được Like
7
Đã thành công tuyệt tác, cảm ơn admin rất nhiều, còn mỗi cái chỗ này nữa, cũng mong admin giúp đỡ nốt thì tốt quá ạ, đó là em nhúng được cái ô tìm kiếm tài liệu (màu vàng) vào thanh navbar rồi nhưng nó cứ lệch lên trên, em dùng mấy cú pháp &nbsp;&nbsp;..... nhưng không xuống giữa được admin ạ. @f0rest !
Cảm ơn admin 1 lần nữa, em tự giải quyết được rồi ạ.
1. Vào admin trong navigation template, thêm dòng sau vào code thêm tab.
29594629_1634983823282382_6521203045408464948_n.jpg

2. Kết quả:
29790747_1634984109949020_3952155697659397056_n.jpg
 

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

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mr. Tuấn

Mobile/Zalo: 0988 488 096

Telegram: bluekpro

Email: [email protected]

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Top Bottom