Back to vBulletin 3 Articles

Add a Drop Down Menu - Relative Positioning
by Lee Roberts 03 Oct 2008
Rating: (2 votes - 4.00 average)

Ok so we have read the "Add Drop Down Menu To Navbar"

and this gives us a drop down menu like this:



But we still need/want the menus to display under the Text link rather then to the left of the table cell the Text link is located in.

Like This:



This tutorial explains how to create an additional drop down menu in your default/stock vB navbar, with the drop down menu showing under the Link.

Firstly, locate in your "navbar" template the first instace of:
Code:
<if condition="$show['popups']">
Then add after it:
Code:
<td class="vbmenu_control"><a href="#" id="custommenu">Main 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 -->
Then add after it:
Code:
<div class="vbmenu_popup" id="custommenu_menu" style="display:none" align="$stylevar[left]">
<table cellpadding="4" cellspacing="1" border="0">
        <tr>
            <td class="thead">Main Menu</td>
        </tr>
        <tr><td class="vbmenu_option"><a href="http://www.mycncuk.com/index.php">Home</a></td></tr>
<tr><td class="vbmenu_option"><a href="http://www.mycncuk.com/forums/forumdisplay.php?f=16">Site News</a></td></tr>
<tr>
<td class="vbmenu_option"><a href="http://www.mycncuk.com/forums/forumdisplay.php?f=50">Links Directory</a></td></tr>
<tr>
<td class="vbmenu_option"><a href="http://www.mycncuk.com/forums/search.php">Site Search</a></td></tr>
</table>
</div>

Ok so you will need to edit the links that point to my site to your own site 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.

.

vblts.ru supports vBulletin®, 2022-2024