Managing Nav Tabs?

Wing · Apr 16, 2013

What is the best way to tackle the management of these tabs?
Is there a good mod out there to add/delete/re-order the tabs conveniently. Is there already the options in the ACP? Or am I just being lazy... and this takes custom code work to accomplish?

Thanks.

EQnoble · Apr 16, 2013

Wing said:
What is the best way to tackle the management of these tabs?
Is there a good mod out there to add/delete/re-order the tabs conveniently. Is there already the options in the ACP? Or am I just being lazy... and this takes custom code work to accomplish?

Thanks.

You want... http://xenforo.com/community/resources/nodes-as-tabs.9/... it really saves a headache if you are not a coder and saves time if you are.

Wing · Apr 16, 2013

EQnoble said:
You want... http://xenforo.com/community/resources/nodes-as-tabs.9/... it really saves a headache if you are not a coder and saves time if you are.

Looks just like something I would need

What about managing the current stock Xenforo tabs? And reordering?

EQnoble · Apr 16, 2013

Currently for that, I believe you would need to do some template editing (if there is another solution someone else can chime in here).

To change the order of navigation tabs you can simply move the blocks which create them around and realize the order that you want.

Edit Template: navigation

In the template you will notice  noting which block is which...for instance...

If you wanted  to appear at the end of the navtabs list no matter what...

you could simply copy the  block and paste it in after the rest of the blocks. (realistically you would be cutting and pasting)

This being the 'Forum' block...you would move this

Code:

        <!-- forums -->
        <xen:if is="{$tabs.forums}">
            <li class="navTab forums {xen:if $tabs.forums.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$tabs.forums.href}" class="navLink">{$tabs.forums.title}</a>
                <a href="{$tabs.forums.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$tabs.forums.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} forumsTabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$tabs.forums.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    <ul class="secondaryContent blockLinksList">
                    <xen:hook name="navigation_tabs_forums">
                        <xen:if is="{$visitor.user_id}"><li><a href="{xen:link 'forums/-/mark-read', $forum, 'date={$serverTime}'}" class="OverlayTrigger">{xen:phrase mark_forums_read}</a></li></xen:if>
                        <xen:if is="{$canSearch}"><li><a href="{xen:link search, '', 'type=post'}">{xen:phrase search_forums}</a></li></xen:if>
                        <xen:if is="{$visitor.user_id}"><li><a href="{xen:link 'watched/threads'}">{xen:phrase watched_threads}</a></li></xen:if>
                        <li><a href="{xen:link 'find-new/threads'}" rel="nofollow">{xen:phrase whats_new}</a></li>
                    </xen:hook>
                    </ul>
                </div>
            </li>
        </xen:if>

to the end of the template after the  block

with forums removed from the beginning of the template you will end up having the end of your template looking like this....

Code:

        <!-- 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}</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', 'Popup PopupControl PopupClosed'}">
         
                <a href="{$tabs.forums.href}" class="navLink">{$tabs.forums.title}</a>
                <a href="{$tabs.forums.href}" class="SplitCtrl" rel="Menu"></a>
             
                <div class="{xen:if {$tabs.forums.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} forumsTabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$tabs.forums.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    <ul class="secondaryContent blockLinksList">
                    <xen:hook name="navigation_tabs_forums">
                        <xen:if is="{$visitor.user_id}"><li><a href="{xen:link 'forums/-/mark-read', $forum, 'date={$serverTime}'}" class="OverlayTrigger">{xen:phrase mark_forums_read}</a></li></xen:if>
                        <xen:if is="{$canSearch}"><li><a href="{xen:link search, '', 'type=post'}">{xen:phrase search_forums}</a></li></xen:if>
                        <xen:if is="{$visitor.user_id}"><li><a href="{xen:link 'watched/threads'}">{xen:phrase watched_threads}</a></li></xen:if>
                        <li><a href="{xen:link 'find-new/threads'}" rel="nofollow">{xen:phrase whats_new}</a></li>
                    </xen:hook>
                    </ul>
                </div>
            </li>
        </xen:if>
 
     
        <!-- 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>

Ends up with this....

If you only want to remove a tab and only for visual reasons you can simply select a tab with css and display none...for instance with the help tab...if you wanted to simply not show it and didn't want to mess around with templates much...you could paste this in EXTRA.css

Code:

.navTab.help {
    display: none;
}

Would end up with this now...

Morgain · Apr 16, 2013

If you are cautious about copying and pasting code as I am - don't use Cut. Copy the block into the new position first. If all is well you'll see it appear on the frontend after refresh in both positions. Then delete the old one.

I also add MOVED to the comment. Makes it easy to find.

EQnoble · Apr 16, 2013

Or

(Ctrl+A) while active in the contents of a template....
(Ctrl+C) copy contents of said template...
(Ctrl+V) paste the contents from that template into a new document in your code editor.... (I use notepad++)

If you mess things up horribly you can just paste back in the entire template you copied in the first place...this allows you to keep it moving when you are getting it right and instantly bring it back to where you started when you mess it up.

Morgain · Apr 16, 2013

EQ nice one. I also keep an rtf document copy of all templates I alter on file on my computer.

Lycaon · Apr 16, 2013

If you click save all changes and not save and exit, you can also Ctrl+Z undo changes.

EQnoble · Apr 16, 2013

Morgain said:
EQ nice one. I also keep an rtf document copy of all templates I alter on file on my computer.

I would not use rtf for reasons I wont even get into but what I would suggest is getting notepad++ and saving your template backups as template_name.html and you will get all of the highlighting as well.

Wing · Apr 17, 2013

Thankyou for the info everyone.
I will be trying these code steps this evening, and get back to you with what success I achieve.

Wing · Apr 25, 2013

What about reordering tabs from mods? They seem to be custom hooked up there... and I really need to de clutter my nav bar

www.optiksgaming.com

Marcel · Feb 26, 2014

I think you then need to change the execution order of the listener which hooks into the tabs

Marcel · Apr 3, 2015

Aaaand I googled how to do this, and end up answering my own question with my own answer from a year ago!

Sutekh · Jun 28, 2016

Is there an easier way to move current tabs? like I want to move the about us page to the end of the navigation bar

Managing Nav Tabs?

Wing

Well-known member

EQnoble

Well-known member

Wing

Well-known member

EQnoble

Well-known member

Morgain

Well-known member

EQnoble

Well-known member

Morgain

Well-known member

Lycaon

Well-known member

EQnoble

Well-known member

Wing

Well-known member

Wing

Well-known member

Marcel

Active member

Marcel

Active member

Sutekh

Member

Similar threads

We value your privacy