The Arcive of Official vBulletin Modifications Site.It is not a VB3 engine, just a parsed copy! |
|
How To Add Drop Down Menus To Your Navbar
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']"> Code:
<td id="custommenu" class="vbmenu_control"> <a href="#">Custom Menu</a> <script type="text/javascript"> vbmenu_register("custommenu"); </script> </td> Next, in your navbar template find Code:
<!-- NAVBAR POPUP MENUS --> 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> 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> If you wish to break your menu into sections like the quicklinks use then add Code:
<tr> <td class="thead">Custom Menu</td> </tr> 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. |
#52
|
|||
|
|||
Excelent tutorial! (and rated as such)
I'm running into an issue where the links aren't showing like the other drop downs that come with the forum. Rather it's showing like the formatting is wrong, as shown in the picture here: I want the links under the "New Posts" label and not to the right of it. I also want the colors to match the other drop down menus....but I need to fix the first issue first... here is my code: Code:
<<script type="text/javascript"> <!-- function log_out() { ht = document.getElementsByTagName("html"); ht[0].style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)"; if (confirm('$vbphrase[sure_you_want_to_log_out]')) { return true; } else { ht[0].style.filter = ""; return false; } } //--> </script> <br /> <!-- breadcrumb, login, pm info --> <table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center"> <tr> <td class="alt1" width="100%"> <if condition="is_array($navbits)"> <if condition="$first_navbit[0] AND !$final_navbit[0]"> <div class="navbar" style="font-size:10pt"><a href="$first_navbit[0]" accesskey="1"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_start.gif" alt="" border="0" /></a> <strong>$first_navbit[1]</strong></div> <else /> <table cellpadding="0" cellspacing="0" border="0"> <tr valign="bottom"> <td><a href="<if condition="$bitters">$first_navbit[0]<else />#</if>" onclick="history.back(1); return false;"><img src="$stylevar[imgdir_misc]/navbits_start.gif" alt="$vbphrase[go_back]" border="0" /></a></td> <td> </td> <td width="100%"><span class="alt2"><a href="<if condition="$bitters">$first_navbit[0]<else />$vboptions[forumhome].php$session[sessionurl_q]</if>"><if condition="$bitters">$first_navbit[1]<else />$vboptions[bbtitle]</if></a></span> $navbits[breadcrumb]</td> </tr> <tr> <td class="navbar" style="font-size:10pt; padding-top:1px" colspan="3"><if condition="$_SERVER['REQUEST_METHOD'] == 'POST'"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_finallink.gif" alt="" border="0" /><else /><a href="<if condition="$bitters">$final_navbit[0]<else />$scriptpath</if>"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_finallink.gif" alt="$vbphrase[reload_this_page]" border="0" /></a></if> <strong><if condition="$bitters">$final_navbit[1]<else />$navbits[lastelement]</if></strong></td> </tr> </table> </if> <else /> <div class="navbar" style="font-size:10pt"><a href="$vboptions[forumhome].php$session[sessionurl_q]" accesskey="1"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_start.gif" alt="" border="0" /></a> <strong>$vboptions[bbtitle]</strong></div> </if> </td> <if condition="$show['member']"> <td class="alt2" valign="top" nowrap="nowrap"> <div class="smallfont"> <strong><phrase 1="$bbuserinfo[username]">$vbphrase[welcome_x]</phrase></strong><br /> <phrase 1="$pmbox[lastvisitdate]" 2="$pmbox[lastvisittime]">$vbphrase[last_visited_x_at_y]</phrase> <if condition="$show['pmstats']"><br /><phrase 1="$vbphrase[unread_x_nav_compiled]" 2="$vbphrase[total_x_nav_compiled]" 3="$session[sessionurl_q]">$vbphrase[private_messages_nav]</phrase></if> <if condition="$show['pmwarning']"><br /><strong><phrase 1="$vbphrase[pmpercent_nav_compiled]">$vbphrase[your_pm_box_is_x_full]</phrase></strong></if> </div> </td> <else /> <td class="alt2" nowrap="nowrap" style="padding:0px"> <!-- login form --> <form action="login.php?do=login" method="post" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, $show[nopasswordempty])"> <script type="text/javascript" src="clientscript/vbulletin_md5.js?v=$vboptions[simpleversion]"></script> <table cellpadding="0" cellspacing="$stylevar[formspacer]" border="0"> <tr> <td class="smallfont"><label for="navbar_username">$vbphrase[username]</label></td> <td><input type="text" class="bginput" style="font-size: 11px" name="vb_login_username" id="navbar_username" size="10" accesskey="u" tabindex="101" value="$vbphrase[username]" onfocus="if (this.value == '$vbphrase[username]') this.value = '';" /></td> <td class="smallfont" colspan="2" nowrap="nowrap"><label for="cb_cookieuser_navbar"><input type="checkbox" name="cookieuser" value="1" tabindex="103" id="cb_cookieuser_navbar" accesskey="c" />$vbphrase[remember_me]</label></td> </tr> <tr> <td class="smallfont"><label for="navbar_password">$vbphrase[password]</label></td> <td><input type="password" class="bginput" style="font-size: 11px" name="vb_login_password" id="navbar_password" size="10" tabindex="102" /></td> <td><input type="submit" class="button" value="$vbphrase[log_in]" tabindex="104" title="$vbphrase[enter_username_to_login_or_register]" accesskey="s" /></td> </tr> </table> <input type="hidden" name="s" value="$session[sessionhash]" /> <input type="hidden" name="do" value="login" /> <input type="hidden" name="vb_login_md5password" /> <input type="hidden" name="vb_login_md5password_utf" /> </form> <!-- / login form --> </td> </if> </tr> </table> <!-- / breadcrumb, login, pm info --> <!-- nav buttons bar --> <div align="center"> <table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="0" border="0" width="100%" align="center" style="border-top-width:0px"> <tr align="center"> <if condition="$show['member']"> <td id="usercpoptions" class="vbmenu_control"><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_cp]</a> <script type="text/javascript"> vbmenu_register("usercpoptions"); </script></td> </if> <if condition="$show['registerbutton']"> <td class="vbmenu_control"><a href="register.php$session[sessionurl_q]" rel="nofollow">$vbphrase[register]</a></td> </if> <td class="vbmenu_control"><a href="faq.php$session[sessionurl_q]" accesskey="5">$vbphrase[faq]</a></td> <td class="vbmenu_control"><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></td> <td class="vbmenu_control"><a href="vbgooglemapme.php$session[sessionurl_q]">$vbphrase[user_map]</a></td> <if condition="$show['popups']"> <if condition="$show['searchbuttons']"> <if condition="$show['member']"> <td id="newposts" class="vbmenu_control"> <a href="#">New Posts</a> <script type="text/javascript"> vbmenu_register("newposts"); </script> </td> <else /> <td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td> </if> <td id="navbar_search" class="vbmenu_control"><a href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[search]</a> <if condition="$show['quicksearch']"><script type="text/javascript"> vbmenu_register("navbar_search"); </script></if></td> </if> <if condition="$show['member']"> <td id="usercptools" class="vbmenu_control"><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 class="vbmenu_control"><a href="search.php$session[sessionurl_q]" accesskey="4">$vbphrase[search]</a></td> <if condition="$show['member']"> <td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td> <else /> <td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td> </if> </if> <td class="vbmenu_control"><a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a></td> <if condition="$show['member']"> <td class="vbmenu_control"><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&focus=1','buddylist','statusbar=no,menubar=no,toolbar=no,scrollbars=yes,resizable=yes,width=250,height=300'); return false;">$vbphrase[open_buddy_list]</a></td> </if> </if> <if condition="$show['member']"> <td class="vbmenu_control"><a href="login.php?$session[sessionurl]do=logout&logouthash=$bbuserinfo[logouthash]" onclick="return log_out()">$vbphrase[log_out]</a></td> </if> </tr> </table> </div> <!-- / nav buttons bar --> <br /> <if condition="$show['forumdesc']"> <table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center"> <tr> <td class="alt1" width="100%"><strong>$foruminfo[title]</strong> <span class="smallfont">$foruminfo[description]</span></td> </tr> </table> <br /> </if> <if condition="$show['popups']"> <!-- NAVBAR POPUP MENUS --> <!-- new posts drop down --> <div class="vbmenu_popup" id="newposts_menu" style="display:none"> <table cellpadding="4" cellspacing="1" border="0"> <tr> <td class="thead">New Posts</td> </tr> <tr> <td class="vbmenu_option" title="nohilite"> <td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a> </td> <tr> <td class="vbmenu_option" title="nohilite"> <td class="vbmenu_control"><a href="vaispy.php" accesskey="2">$vbphrase[ispy]</a></td> </td> </tr> </table> </div> <if condition="$show['searchbuttons']"> <!-- header quick search form --> <div class="vbmenu_popup" id="navbar_search_menu" style="display:none"> <table cellpadding="4" cellspacing="1" border="0"> <tr> <form action="search.php?do=process" method="post"><td class="thead">$vbphrase[search_forums]</td> </tr> <tr> <td class="vbmenu_option" title="nohilite"> <input type="hidden" name="do" value="process" /> <input type="hidden" name="quicksearch" value="1" /> <input type="hidden" name="childforums" value="1" /> <input type="hidden" name="exactname" value="1" /> <input type="hidden" name="s" value="$session[sessionhash]" /> <div><input type="text" class="bginput" name="query" size="25" tabindex="1001" /><input type="submit" class="button" value="$vbphrase[go]" tabindex="1004" /></div> </td> </tr> <tr> <td class="vbmenu_option" title="nohilite"> <label for="rb_nb_sp0"><input type="radio" name="showposts" value="0" id="rb_nb_sp0" tabindex="1002" checked="checked" />$vbphrase[show_threads]</label> <label for="rb_nb_sp1"><input type="radio" name="showposts" value="1" id="rb_nb_sp1" tabindex="1003" />$vbphrase[show_posts]</label> </td> </tr> <tr> <td class="vbmenu_option"><a href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[advanced_search]</a></td></form> </tr> <tr> <form action="http://www.google.com/custom" type="hidden" method=GET name="search"><td class="thead">Search Site using Google</td> </tr> <tr> <td class="vbmenu_option" title="nohilite"> <input type="hidden" name="client" value="pub-1234567890123456"> <input type="hidden" name="forid" value="1"> <input type="hidden" name="ie" value="ISO-8859-1"> <input type="hidden" name="oe" value="ISO-8859-1"> <input name="cof" type="hidden" value="GALT: "> <input name="domains" type="hidden" value="www.mp3car.com"> <input type="hidden" name="hl" value="en"> <input type="text" class="bginput" name="q" size="25" maxlength="255" />$gobutton<br /> <input name="sitesearch" type="radio" value="www.mp3car.com" checked> MP3Car.com<br /> </td></form> </tr> </table> </div> <!-- / header quick search form --> </if> <if condition="$show['member']"> <!-- user cp tools menu --> <div class="vbmenu_popup" id="usercptools_menu" style="display:none"> <table cellpadding="4" cellspacing="1" border="0"> <tr><td class="thead">$vbphrase[quick_links]</td></tr> <if condition="$vboptions['enablesearches']"><tr><td class="vbmenu_option"><a href="search.php?$session[sessionurl]do=getdaily">$vbphrase[todays_posts]</a></td></tr></if> <tr><td class="vbmenu_option"><a href="forumdisplay.php?$session[sessionurl]do=markread">$vbphrase[mark_forums_read]</a></td></tr> <tr><td class="vbmenu_option"><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&focus=1','buddylist','statusbar=no,menubar=no,toolbar=no,scrollbars=yes,resizable=yes,width=250,height=300'); return false;">$vbphrase[open_buddy_list]</a></td></tr> <tr><td class="thead"><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_control_panel]</a></td></tr> <if condition="$show['siglink']"><tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editsignature">$vbphrase[edit_signature]</a></td></tr></if> <!--<if condition="$show['avatarlink']"><tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editavatar">$vbphrase[edit_avatar]</a></td></tr></if>--> <tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editprofile">$vbphrase[edit_profile]</a></td></tr> <tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editoptions">$vbphrase[edit_options]</a></td></tr> <tr><td class="thead">$vbphrase[miscellaneous]</td></tr> <if condition="$show['pmmainlink']"><tr><td class="vbmenu_option"><a href="private.php$session[sessionurl_q]" rel="nofollow">$vbphrase[private_messages]</a></td></tr></if> <tr><td class="vbmenu_option"><a href="subscription.php$session[sessionurl_q]" rel="nofollow">$vbphrase[subscribed_threads]</a></td></tr> <tr><td class="vbmenu_option"><a href="member.php?$session[sessionurl]u=$bbuserinfo[userid]">$vbphrase[my_profile]</a></td></tr> <if condition="$show['wollink']"><tr><td class="vbmenu_option"><a href="online.php$session[sessionurl_q]">$vbphrase[whos_online]</a></td></tr></if> </table> </div> <!-- / user cp tools menu --> </if> <!-- / NAVBAR POPUP MENUS --> <!-- PAGENAV POPUP --> <div class="vbmenu_popup" id="pagenav_menu" style="display:none"> <table cellpadding="4" cellspacing="1" border="0"> <tr> <td class="thead" nowrap="nowrap">$vbphrase[go_to_page]</td> </tr> <tr> <td class="vbmenu_option" title="nohilite"> <form action="$vboptions[forumhome].php" method="get" onsubmit="return this.gotopage()" id="pagenav_form"> <input type="text" class="bginput" id="pagenav_itxt" style="font-size:11px" size="4" /> <input type="button" class="button" id="pagenav_ibtn" value="$vbphrase[go]" /> </form> </td> </tr> </table> </div> <!-- / PAGENAV POPUP --> </if> <if condition="$show['popups'] AND $show['member']"> <div class="vbmenu_popup" id="usercpoptions_menu" style="display:none"> <table cellpadding="4" cellspacing="1" border="0"> <tr><td class="thead" align="$stylevar[left]"><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_control_panel]</a></td></tr> <if condition="$show['pmstats']"><tr><td class="vbmenu_option" align="$stylevar[left]"><a href="private.php$session[sessionurl_q]" rel="nofollow">$vbphrase[private_messages]</a></td></tr></if> <tr><td class="vbmenu_option" align="$stylevar[left]"><a href="subscription.php$session[sessionurl_q]" rel="nofollow">$vbphrase[subscribed_threads]</a></td></tr> <if condition="$show['siglink']"><tr><td class="vbmenu_option" align="$stylevar[left]"><a href="profile.php?$session[sessionurl]do=editsignature">$vbphrase[edit_signature]</a></td></tr></if> <tr><td class="vbmenu_option" align="$stylevar[left]"><a href="profile.php?$session[sessionurl]do=editprofile">$vbphrase[edit_profile]</a></td></tr> <tr><td class="vbmenu_option" align="$stylevar[left]"><a href="profile.php?$session[sessionurl]do=editoptions">$vbphrase[edit_options]</a></td></tr> <tr><td class="thead" align="$stylevar[left]">$vbphrase[miscellaneous]</td></tr> <tr><td class="vbmenu_option" align="$stylevar[left]"><a href="member.php?$session[sessionurl]u=$bbuserinfo[userid]">$vbphrase[my_profile]</a></td></tr> </table> </div> </if> |
#53
|
|||
|
|||
Out of all the NavBars I tried out this is by far the best one.
|
#54
|
|||
|
|||
Hey Sjakie did you work out how to do this with an image and no arrow?
|
#55
|
|||
|
|||
I've figured it out. Look at the code that I've used on my forum for the "extra" button:
PHP Code:
|
#56
|
|||
|
|||
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 dropdown with more options until they click on it. Thanks again for sharing it, really appreciate it |
#57
|
|||
|
|||
Great to be of assistance.
Don't know how to make it pop up. But I've seen a tutorial on xbox live GamerTag popups that includes that feature, maybe you can look that up.. |
#58
|
|||
|
|||
The menu isn't working for me for some reason, the menu is just showing up on the page without being clicked on.
Was there any other code you added for it? Thanks again |
#59
|
|||
|
|||
Nope, this is the code I've used. Were did you put it?
There are two parts in this code that have to be put in different locations. |
#60
|
|||
|
|||
Ah right, I just placed all the code into the header to try it out before editing it for my own images/links.
Thanks again |
#61
|
|||
|
|||
How to make custom style to each vb_menu?
Example, menu one use this image (menu_open.gif) and other menu use an custom image by me. In another words.... many vb_menu in same page, but custom and distinct style for each. Thank you! |
|
|
X vBulletin 3.8.12 by vBS Debug Information | |
---|---|
|
|
More Information | |
Template Usage:
Phrase Groups Available:
|
Included Files:
Hooks Called:
|