Go Back   vb.org Archive > vBulletin Article Depository > Read An Article > vBulletin 3 Articles

Reply
 
Thread Tools
How To Add Drop Down Menus To Your Navbar
peterska2
Join Date: Oct 2003
Posts: 6,504

 

Manchester, UK
Show Printable Version Email this Page Subscription
peterska2 peterska2 is offline 07-29-2006, 10:00 PM

I think everyone has encountered the situation at some point or other where their navbar has got very cluttered and they are faced with either adding yet another navbar, or adding some dropdown menus to group some items.

This tutorial explains how to create an additional drop down menu in your navbar.

Firstly, locate in your navbar template the first instace of
Code:
<if condition="$show['popups']">
and add after it
Code:
<td id="custommenu" class="vbmenu_control">
    <a href="#">Custom Menu</a>
    <script type="text/javascript">
        vbmenu_register("custommenu");
    </script>
</td>
Replace Custom Menu with the title for this menu which you want displayed on your navbar and custommenu with the name that you want to give your link. Note that spaces are not to be used as this will break the connection with the actual menu.

Next, in your navbar template find
Code:
<!-- NAVBAR POPUP MENUS -->
and add after it
Code:
<div class="vbmenu_popup" id="custommenu_menu" style="display:none">
<table cellpadding="4" cellspacing="1" border="0">
        <tr>
            <td class="thead">Custom Menu</td>
        </tr>
        <tr>
            <td class="vbmenu_option" title="nohilite">
content row
</td>
</tr>
</table>
</div>
Again replace custommenu with the name given to your link. Make sure that you leave the _menu after it as this identifies it as the menu part of the link. Also replace Custom Menu again with the title that you have used for your link.

The content row should be replaced with the actual menu item that you want to have in your new drop down menu.

Repeat the code
Code:
<tr>
            <td class="vbmenu_option" title="nohilite">
content row
</td>
</tr>
as required to add additional links onto your menu.

If you wish to break your menu into sections like the quicklinks use then add
Code:
<tr>
            <td class="thead">Custom Menu</td>
        </tr>
everywhere that you wish to add a new header.

The content added should be in the normal html format for links.



If you wish to add more than one menu, repeat the process for each one, ensuring that you use a different name for each menu otherwise they will not function correctly.


I hope you find this useful.
Reply With Quote
  #62  
Old 03-17-2007, 01:37 AM
unenergizer unenergizer is offline
 
Join Date: Nov 2004
Location: Texas, YE HAW
Posts: 329
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

How can I remove menu_open.gif from my nav bar? I haven't been able to figure this out.
Reply With Quote
  #63  
Old 03-17-2007, 03:54 PM
Itworx4me's Avatar
Itworx4me Itworx4me is offline
 
Join Date: Feb 2002
Posts: 210
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by John Diver View Post
Thanks great, thanks very much!

You don't know how to make it show when a user hovers over it instead of clicking? Just because most users wouldn't know there is a drop down with more options until they click on it.

Thanks again for sharing it, really appreciate it
I would also be interested in how to get the drop down menu to activate when you mouse over the link.

Thanks,
Itworx4me
Reply With Quote
  #64  
Old 03-18-2007, 02:32 AM
unenergizer unenergizer is offline
 
Join Date: Nov 2004
Location: Texas, YE HAW
Posts: 329
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Well I was going to add the drop down menu to my dark_vb_v2 style, but the menu_open.gif throws off the look. I noticed that its a javascript thats stored in the clientscript folder. Does this mean I can't edit out the menu_open.gif file? I have come to that conclusion, though I may be wrong.
Reply With Quote
  #65  
Old 03-23-2007, 07:53 PM
Ophelia Ophelia is offline
 
Join Date: Feb 2006
Posts: 204
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Question, what is different with the code for Quick Links and this code that would render the new code non-working in Safari? I have everything entered correct, works perfectly in Firefox and IE, but if you use Safari, all the new links are unclickable. They are able to clickable links if they use the code that is there for Quick Links or Search.. so there is something in that code that I need to duplicate to get to work.
Reply With Quote
  #66  
Old 04-18-2007, 06:36 PM
rickyreter rickyreter is offline
 
Join Date: Nov 2006
Location: sussex,UK
Posts: 233
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

I have installed this and want to add another menu can u do this..

And what i do the same??

Peter
Reply With Quote
  #67  
Old 04-18-2007, 08:46 PM
SherryG SherryG is offline
 
Join Date: Oct 2006
Posts: 47
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Hi Kerry Ann,

I was wondering if I might have some assistance with adding a drop down menu to my navigation bar. I have been struggling with this and just cannot get it to work. I think part of my problem is because I am using a custom template in which all links to my navigation bar are added to the "header" template and not the navbar template. Argh, I'm ready to pull my hair out.

My navigation bar is getting too cluttered so I want to add a drop down menu called "Fun & Games" in which a link to my Chatroom, Arcade and MP3 player will appear.

Here is a copy of my Header template. Can you assist me and show me where and how I would add a drop down menu? I will gladly pay you for your time. The content below outlined in green is the content which should appear in the new pull down menu.

<a name="top"></a>
<table border="0" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td class="headerbg"><table width="654" border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="headerlogo"><a href="http://stamp-shack.com"><img src="images/girltalk/girlTalk_01.gif" style="border:none;" width="199" height="119" alt="$vboptions[bbtitle]" /></td>
<td class="headerlogo2">&nbsp;</td>
</tr>
</table></td>
</tr>
<tr>
<td class="nav"><div class="navpad">
<!-- nav buttons bar -->


<div align="center">
<table id="navstyle" cellpadding="$stylevar[cellpadding]" cellspacing="0" border="0" width="100%" align="center" style="border-top-width:0px">
<tr align="center">
<td><a href="http://stamp-shack.com">Home</a></td>
<td><a href="http://stamp-shack.com/cmps_index.php?page=membership">Membership</a></td>
<if condition="$show['member']">
<td><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_cp]</a></td>
</if>
<if condition="$show['registerbutton']">
<td><a href="register.php$session[sessionurl_q]" rel="nofollow">$vbphrase[register]</a></td>
</if>
<td><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></td>
<td><a href="http://stamp-shack.com/forum/index.php">Forums</a></td>
<td><a href="/photopost">Gallery</a></td>
<td><a href="http://stamp-shack.com/swap">Swaps</a></td>
<td><a href="/forum/chat/flashchat.php">Chat</a></td>
<td><a href="http://stamp-shack.com/forum/local_links.php">Templates</a></td>
<td class="vbmenu_control"><a href="arcade.php?$session[sessionurl_q]">Arcade</a></td>

I WANT TO ADD MY PULL DOWN MENU HERE


<!—Mp3 Player Launch -->
<if condition="$show['member']">
<td class="vbmenu_control"><a href="javascript:NewWindow=window.open('http://stamp-shack.com/forum/mp3playerindex.php?do=viewmp3playerpopup','newWin' ,'width=500,height=500,left=0,top=0, toolbar=No,location=No,scrollbars=1,status=No,resi zable=No,fullscreen=No');
NewWindow.focus(); void(0);">MP3 Player</a></td>
</if>
<!—End Mp3 Player Launch -->


<td><a href="calendar.php$session[sessionurl_q]">$vbphrase[calendar]</a></td>
<if condition="$show['popups']">
<if condition="$show['searchbuttons']">
<if condition="$show['member']">
<td><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td>
<else />
<td><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>
</if>
<td id="navbar_search"><a href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[search]</a> <script type="text/javascript"> vbmenu_register("navbar_search"); </script></td>
</if>
<if condition="$show['member']">
<td id="usercptools"><a href="$show[nojs_link]#usercptools">$vbphrase[quick_links]</a> <script type="text/javascript"> vbmenu_register("usercptools"); </script></td>
</if>
<else />
<if condition="$show['searchbuttons']">
<td><a href="search.php$session[sessionurl_q]" accesskey="4">$vbphrase[search]</a></td>
<if condition="$show['member']">
<td><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td><else />
<td><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>
</if>
</if>
<td><a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a></td>
<if condition="$show['member']">
<td><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&amp;focus=1','buddylist','statusbar=n o,menubar=no,toolbar=no,scrollbars=yes,resizable=y es,width=250,height=300'); return false;">$vbphrase[open_buddy_list]</a></td>
</if>
</if>
<if condition="$show['member']">
<td><a href="login.php?$session[sessionurl]do=logout&amp;logouthash=$bbuserinfo[logouthash]" onclick="return log_out()">$vbphrase[log_out]</a></td>
</if></tr>
</table>

</div>
<!-- / nav buttons bar -->
</div></td>
</tr>
<tr>
<td class="contentbg">
<!-- /logo -->

<!-- content table -->


$spacer_open
$_phpinclude_output
Reply With Quote
  #68  
Old 04-18-2007, 08:53 PM
rickyreter rickyreter is offline
 
Join Date: Nov 2006
Location: sussex,UK
Posts: 233
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

All sorted now..just on my 3rd menu..lol..

Took awhile but sussed it out


Peter
Reply With Quote
  #69  
Old 08-31-2007, 08:13 AM
David Lama David Lama is offline
 
Join Date: Apr 2007
Posts: 82
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

i dont understand the part about adding more than 1. its not working for me. i did add more than 1 but all it did was add two new sections to my nav bar instead of just 1 with 2 links
Reply With Quote
  #70  
Old 09-08-2007, 12:05 PM
Bruxa Bruxa is offline
 
Join Date: May 2007
Posts: 1
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Hi,

I have integrated a popmenu like this in my navbar. But it does not show when users are not logged in. I was wondering if you could tell me why this might be the case?
It works fine for logged in users.
I have not surrounded any part of the menu with a conditional show['members'] so not show why it isn't working...

okay, I have just taken another look. The problem is it works in Firefox but not it Internet Explorer. the problem is: it does not drop down on the site homepage. once in the forum section it works okay, it does not matter if you are logged in or not.
Reply With Quote
  #71  
Old 09-12-2007, 05:19 AM
jeremyalyea jeremyalyea is offline
 
Join Date: Feb 2007
Location: Detroit
Posts: 37
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by SherryG View Post
Hi Kerry Ann,
I think part of my problem is because I am using a custom template in which all links to my navigation bar are added to the "header" template and not the navbar template.
I have the same problem with my links being in the header template instead of the navbar. Does anyone know how I could create a drop-down menu that wouldn't mess up all of the formatting?
Reply With Quote
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 12:30 AM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.08308 seconds
  • Memory Usage 2,333KB
  • Queries Executed 26 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (6)bbcode_code
  • (2)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_article
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (4)pagenav_pagelink
  • (1)pagenav_pagelinkrel
  • (11)post_thanks_box
  • (11)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (11)post_thanks_postbit_info
  • (10)postbit
  • (11)postbit_onlinestatus
  • (11)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • fetch_musername
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete