Turning the breadcrumb into a navigation menu idea. Rubbish?

[Stuart Wright]

Not sure if this is a small or big feature.

So we have had an extended menu on AVForums for years where people can drill down a fair way into the sub forums to quickly get to the area of interest.


and I was thinking about how we could implement this into Xenforo when we move in August.
Going forward the new header will have more of an emphasis on editorial and the forums will be just one of several main menu options, making the job even harder.



Then I had a thought that maybe we could use the breadcrumb as a way to navigate through the nodes.
Hover over one of the breadcrumbs in the trail and the whole list of siblings drops down. From there it's possible to highlight one and its children pop out to the right in another list. And so on.

I created a mockup. Obviously it would need to be styled to look much prettier.


It would allow for relatively fast navigation to every node in the forum from every page, and would, of course, need to use the jQuery system detailed here.
Anyone think this is a good idea? Or is it rubbish?

 

[Khaleal]

I like the way how AVForums use navbars

 

[dbembibre]

I think that is a great idea

 

[Puntocom]

I like it very much.

 

[Digital Doctor]

+CORE.



Very logical idea.

 

[Deepmartini]

@James - need to Like it then.

I too think this is good.
Just as a touch of spice I already added a LATEST! button on the end of breadcrumbs top n footer. Opens "Recent Threads"
It's almost frighteningly popular!

Is there a tutorial on how to do that?

 

[Stuart Wright]

We've got so far with this and now we're stuck. I think we need a JS/jQuery GOD to figure out and implement a way to do this:
I want my members to be able to navigate to every forum from the breadcrumb.
Is there anyone out there good enough to make this work?

 

[EQnoble]

We've got so far with this and now we're stuck. I think we need a JS/jQuery GOD to figure out and implement a way to do this:
I want my members to be able to navigate to every forum from the breadcrumb.
Is there anyone out there good enough to make this work?
View attachment 52752

I have this hackishly worked out (the jquery submenu thingy displayed on hover of a breadcrumb item) but my problem is that I don't know of any way other than manually hard coding every entry or scraping to get the entire node tree and have it available to my script for use of listing menu items.

Basically for my script to work at this point you would have to hard code all node info into the script or scrape bc links to get the child nodes for the list.

I do have an idea that I POC'd (for a standalone jquery menu I built) to allow for all submenus to display without going screwy on narrow widths while responsive, it adds an extra click to the whole thing as far as use goes but it is the only way I could find to not sacrifice displaying all child nodes on node hover which is the whole point of this thing...responsive or not imo.


I see that you are going live in August with XF and I don't know that I could finish it by then (trying to get all public nodes is what is stumping me.) or if I will be around at that point due to personal issues. However if I can do what I have at this point (and I am no God)...I am sure you will find someone that can get this done for you, which is great because this is something I think will be very useful for the way certain visitors browse.

Best of luck with this.

 

[FredC]

Subscribed!!!

 

[Stuart Wright]

The node tree menu needs to obey permissions, so it has to be loaded for each user.
I don't know how to code something like this, but I would imagine Ajax querying the node tree when elements are needed and then caching them might be the way to go.
Or load the whole nodelist into a multi-dimentional array?
The tricky part is coping with a wider menu than the site. As in the above example.
For responsive design, I would even consider switching the breadcrumb menu off because there would be so many problems dealing with it.
Unless there is, like I say, some GOD who can code this.
I hope someone steps up.

 

[Alpha1]

Interesting idea. At first sight I thought it was rubbish, but when I tried the Starcraft breadcrumb then I was sold.
I think this kind of navigation has multiple benefits. Firstly it allows the user to quickly switch one breadcrumb element for another on the same level.
Secondly it allows the user to navigate deep to whatever node the user wants to go.
I would not allow an infinite depth of node levels. As you have illustrated that can result in a chaotic chain of menus which will go out of screen.

It would be nice to see the breadcrumb advance in this way. I'm sure that Mike and Kier can have some fun with this.

 

[Stuart Wright]

What are the chances of getting it before we go live in early September, though?

 

[Alpha1]

I would say about 100% if you have it custom coded. I see Chris is toying with it.
Its one of those things that you have to keep tweaking until it works right.

 

[Jeremy]

What are the chances of getting it before we go live in early September, though?

You won't get it until at least 1.3, so not before September.

 

[Alpha1]

It will need to be coded with semantic microdata though, as its great for SEO if implemented well.

 

[EQnoble]

The node tree menu needs to obey permissions, so it has to be loaded for each user.
I don't know how to code something like this, but I would imagine Ajax querying the node tree when elements are needed and then caching them might be the way to go.
Or load the whole nodelist into a multi-dimentional array?
The tricky part is coping with a wider menu than the site. As in the above example.
For responsive design, I would even consider switching the breadcrumb menu off because there would be so many problems dealing with it.
Unless there is, like I say, some GOD who can code this.
I hope someone steps up.

The interaction with and layout of the menu (the size specifically) is not a problem (in fact it was working out the fix for the problem that arose from making everything narrow that was the pita to square up against), I can make it work down to about 350px as far as I had tested it, my problem would be following the permissions and only displaying nodes available to that user.

 

[Stuart Wright]

The interaction with and layout of the menu (the size specifically) is not a problem (in fact it was working out the fix for the problem that arose from making everything narrow that was the pita to square up against), I can make it work down to about 350px as far as I had tested it, my problem would be following the permissions and only displaying nodes available to that user.

So your solution could cope with our long forum names and deep subforums? That's interesting. That design element of this challenge seems the trickiest part to me. I bet the back end database interrogation and population of the menu structure would be something more people could figure out.

 

[Chris D]

The current version of the breadcrumb menu does a grand job of fetching the correct child nodes for each highlighted node -- it should be pretty trivial to extend it further to obey permissions.

Just didn't get that far.

 

[Alpha1]

So your solution could cope with our long forum names and deep subforums? That's interesting. That design element of this challenge seems the trickiest part to me. I bet the back end database interrogation and population of the menu structure would be something more people could figure out.

I think on large forums its important to limit the length of node names where possible. I have been tweaking that for weeks in order to have 3 column display of subforums working well.

 

[Stuart Wright]

I think on large forums its important to limit the length of node names where possible. I have been tweaking that for weeks in order to have 3 column display of subforums working well.

Compromise between concise node names and best SEO value.

The current version of the breadcrumb menu does a grand job of fetching the correct child nodes for each highlighted node -- it should be pretty trivial to extend it further to obey permissions.

Just didn't get that far.

We have too much to do, Chris

 

[Mike Edge]

We've got so far with this and now we're stuck. I think we need a JS/jQuery GOD to figure out and implement a way to do this:
I want my members to be able to navigate to every forum from the breadcrumb.
Is there anyone out there good enough to make this work?
View attachment 52752

Looks great, though I think each box should justify top of that row