Giving selected navigation tabs dropdown menus [Deleted]

Dad. · Feb 27, 2012

Audentio submitted a new resource:

Giving selected navigation tabs dropdown menus (version 1.0) - A different navigation experience

Hello everyone,

This tutorial will help show you how to setup your XenForo navigation to allow dropdowns on all tabs and it is mainly for skins that want to heavily customize, clear up space in the header, or just want to stand out from the rest. By default, XenForo chooses to display the current tab without a menu and displays the contents of that menu inside the 'tabLinks' class, like so:

View attachment 26377

When you hover over unselected tabs, a menu will display, but this is...

Read more about this resource...

Lone Wolf · Mar 9, 2012

How can I add extra links to the submenu?

Eg forums that I have

John · Mar 10, 2012

Does this work only for the forum tab Mike or does it also work for the others in the nav as well?

kenng · May 28, 2012

Very helpful! Thanks

Bonta-kun · Nov 2, 2012

Hi a good tutorial. All codes have adapted only at Personal Details is not right!
See picture, please help!

My Templates,
navigation:
http://pastebin.com/6T2h7Bf2

navigation_visitor_tabs:
http://pastebin.com/5CBtRXqp

Dad. · Jan 12, 2013

Hey there!

Well, the member dropdown, inbox, and alerts all already have dropdown menus. So, in this case, you would probably just want to delete or hide the tablinks. You can manually add the items to each dropdown menu too, but I don't recommend this. Removing is best. All of the links here show up under your username dropdown menu.

Bonta-kun said:
Hi a good tutorial. All codes have adapted only at Personal Details is not right!
See picture, please help!

My Templates,
navigation:
http://pastebin.com/6T2h7Bf2

navigation_visitor_tabs:
http://pastebin.com/5CBtRXqp

Dad. · Jan 12, 2013

Audentio updated Giving selected navigation tabs dropdown menus with a new update entry:

visitorTabs note

NOTE: The privateTabs area (username, inbox, alerts, logout) already have dropdown menus (save for logout, but I don't think the logout should have a dropdown). So you have to use your best judgement here. For me, I just remove the tablinks for these tabs, since the links shown (Personal Details, Conversations, Your News Feed, Likes You've Received) all show up under the username dropdown anyways).

Read the rest of this update entry...

Bonta-kun · Jan 12, 2013

Can you tell me what I have to delete.

Dad. · Jan 13, 2013

In the navigation_visitor_tab template, find the div called tabLinks and just deleted it.

Alternatively,

Code:

.visitorTabs .tabLinks {display: none}

saves you from having to make that template edit, if you put this in EXTRA.css.

AndreaMarucci · Apr 27, 2013

Audentio said:
Audentio submitted a new resource:

Interesting article. I'm searching for something similar so I'll try to ask you.

You say "By default, XenForo chooses to display the current tab without a menu and displays the contents of that menu inside the 'tabLinks' class". Well I'm searching for a method to replicate this with a custom tab and custom submenu I've created. Have you any suggestion or tips to do that?

Thanks

Etchel · Sep 13, 2013

Please update and also, I would like to ask how you can remove the SplitCtrl. I don't like the arrow popping when hovering the tab. Instead I want the tab to be doing the drop down quicklinks. how can we do that?

Dad. · Sep 13, 2013

There really shouldn't be any change between this and xenforo 1.2.

Also, this comes standard in UI.X.

NeoCHI · Oct 5, 2013

How do I do this for the home tab? Under the navigation template for home all there is:


<xen:if is="{$showHomeLink}">
<li class="navTab home PopupClosed"><a href="{$homeLink}" class="navLink">{xen

hrase home}</a></li>
</xen:if>

NeoCHI · Oct 5, 2013

What's weird is if I make changes to the template regard the home section nothing changes..while if if change the forum section it will change...

Dad. · Oct 5, 2013

NeoCHI said:
How do I do this for the home tab? Under the navigation template for home all there is:


<xen:if is="{$showHomeLink}">
<li class="navTab home PopupClosed"><a href="{$homeLink}" class="navLink">{xenhrase home}</a></li>
</xen:if>

Well the home tab doesn't have a dropdown by default. So it wouldn't have anything to do.

NeoCHI · Oct 6, 2013

Audentio said:
Well the home tab doesn't have a dropdown by default. So it wouldn't have anything to do.

That's weird...mine does.

It has:

Watched Threads
Recent Activity
What's New
Help

Dad. · Oct 6, 2013

Isn't that what you would normally do for forums tab?

Anyways, the tutorial is the same process no matter what tab it is (for the most part).

Russ · Oct 6, 2013

NeoCHI said:
That's weird...mine does.

It has:

Watched Threads
Recent Activity
What's New
Help

You're probably using xenPorta, which you'd follow this tutorial and make sure you apply it to the extra tabs area.

NeoCHI · Oct 7, 2013

Russ said:
You're probably using xenPorta, which you'd follow this tutorial and make sure you apply it to the extra tabs area.

Yes I am using xenPorta, also Nodes as Tabs. Can you explain what I need to do in more detail?

Dad. · Oct 7, 2013

NeoCHI said:
Yes I am using xenPorta, also Nodes as Tabs. Can you explain what I need to do in more detail?

See the part in the tutorial that starts with:

Even though this is the forums tab, the code change is the same.

First, find:

Start there. Essentially what you're doing is adding/removing popup control classes, that's all.

Giving selected navigation tabs dropdown menus [Deleted]

Well-known member

Well-known member

Well-known member

Member

Member

Well-known member

Well-known member

Member

Well-known member

Well-known member

Member

Well-known member

Active member

Active member

Well-known member

Active member

Well-known member

Well-known member

Active member

Well-known member

Similar threads

We value your privacy