Quick Navigation Menu

Oh okay um. Can I use your sprite sheet please? lol

I don't mind you using my spritesheet but it may cause more problems for you. Firstly, I've modified and added different coloured icons to compliment my style and secondly I've adjusted the sizes of the rss feed icon within the spritesheet so you would have to add and fix more stuff into your extra.css. In short it wouldn't be worth it just to have the (what i think) hideous styling button in your breadcrumbs.

What I'll do when I get a few minutes is I'll grab a default spritesheet and add in the additional image for those that wish to have the ign type style breadcrumb image. Personally, i think it looks hideous I was more posting this for you to show you how easy it was without the need to edit any templates.

Couldn't you simply modify the CSS and add text to where the image is and style it to look like a button? I can't test it since I'm not a customer, but I think that would work.

Yes Please!!! Hmm yes the button does look kind of hideous but its the most useful button on the site lol. I'll take it even if it's hideous. At least we're able to change the color though.

Code:

.breadcrumb .jumpMenuTrigger {
    background: url("@imagePath/xenforo/xenforo-ui-sprite.png") no-repeat scroll 6px -52px #131313 !important;
    border-radius: 4px 4px 4px 4px;
    height: 20px;
    margin: 2px;
    width: 115px;
}
 
.breadcrumb .jumpMenuTrigger:hover {
    opacity: 0.6;
}

Looks great now! Not hideous at all! Thanks!

My members are telling me that they didn't even know it was there. I told them that it has always been there. All I did was add words next to it. It looks great. Thanks alot Shelly! This should be added to Xenforo default package.

thanks shalley very useful tool
for those who are looking for an the arabic version for the spritsheet and psd file for other languages see the attachment

Is there a way to remove the "quick navigation" entirely? I am trying to simplify my site to give it a minimal look. I deleted all of the contents in the quick_navigation_menu and quick_navigation_menu.css but the little icon still shows up and when you click on it, it tries to open (but won't cause theres nothing there). How do I get rid of that entirely? Is there a feature in the control panel for this or do I have to delete the image itself as well? I want to remove it but not break other parts of the site.

Add to extra.css

Code:

.breadcrumb .jumpMenuTrigger {
display:none;}

Wow that worked! Thanks!!!

Just added this to CycleChat - thanks for the info.

I added the Quick Navigation link to my sidebar - which is on practically every page.
It's amazingly useful once it comes out of hiding behind its tiny icon. Together with the Recent Threads link it practically does all my navigation.

This is my code from my sidemenu template:

Code:

<img src="@imagePath/starmini.png" / >&nbsp;&nbsp;
<a href="{xen:link misc/quick-navigation-menu, '', 'selected={$quickNavSelected}'}" class="OverlayTrigger jumpMenuTrigger" data-cacheOverlay="true" title="{xen:phrase open_quick_navigation}"><b>QUICKMENU</b><!--{xen:phrase jump_to}...--></a>
&nbsp;&nbsp;<img src="@imagePath/starmini.png" / >

The brown bits are styling specific to how I have it.
- A star image each side of it which is how I emphasise the key elements of the menu.
- Bold.
- Label QUICKMENU as this fits better into a small space than Quick Navigation.

Also added Quick Navigation as a navbar tab using code Jake Bunce provided in this post.
It's in his nodes-as-tabs addon but I don't think that line of code needs the addon.
Again I use the title QUICKMENU as it's so much shorter.