[HowTo] navbar tweak > Turn UserCP into a dropdown

[Floris]

How To > Optimize the navbar!

Tweak > Turn the "User CP" link into a drop down

Description:

With this template modification I will teach you how to optimize the navbar with a little tweak. We will turn the usercp link into a drop down, remove the links from the quick links drop down and put them in the usercp drop down.

This is for version 3.0.3

Installation:

* Goto the Admin Control Panel as Administrator

* Goto the Styles & Templates group and open the Style Manager

* Open your navbar template and apply the following changes:

# Find this code, and remove it:

<tr><td class="thead"><a href="usercp.php?$session[sessionurl]">$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>

# Now find this code, and remove it:

<tr><td class="vbmenu_option"><a href="member.php?$session[sessionurl]u=$bbuserinfo[userid]">$vbphrase[my_profile]</a></td></tr>

# Now find this code:

<!-- / NAVBAR POPUP MENUS -->

# Above that, on a new line, add this code:

<if condition="$show['member']">
<!-- user cp drop down menu -->
<div class="vbmenu_popup" id="cpuser_menu" style="display:none">
<table cellpadding="4" cellspacing="1" border="0">
<tr><td class="thead"><a href="usercp.php?$session[sessionurl]">$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="vbmenu_option"><a href="member.php?$session[sessionurl]u=$bbuserinfo[userid]">$vbphrase[my_profile]</a></td></tr>
 
</table>
</div>
<!-- / user cp drop down menu -->
</if>

# Find this code:

<if condition="$show['member']">
<td class="vbmenu_control"><a href="usercp.php?$session[sessionurl]">$vbphrase[user_cp]</a></td>
</if>

# And replace it with this code:

<if condition="$show['member']">
<if condition="$show['popups']">
	<td id="cpuser" class="vbmenu_control"><a href="#cpuser">$vbphrase[user_cp]</a> <script type="text/javascript"> vbmenu_register("cpuser"); </script></td>
<else />
	<td class="vbmenu_control"><a href="usercp.php?$session[sessionurl]">$vbphrase[user_cp]</a></td>
</if>
</if>
 

# Save the navbar template and you are done!

[HexOnxOnx]

Great work as always Floris! I have this on one of my boards now. I was going to ask you how to do this since I saw it on your site.

[Floris]

This is how :P
Enjoy it.

[Khaleel]

Keep it up! That was fantastic little tip and its well handy, thanks

[manguish]

Nice one

Members love it - cheers.

[Blaminator]

Thanks

I like it

[ryanmartin1172]

In this Step

# Find this code:


HTML Code:

<if condition="$show['member']"><td class="vbmenu_control"><a href="usercp.php?$session[sessionurl]">$vbphrase[user_cp]</a></td></if>

My source reads this

<if condition="$show['member']">
<!-- user cp tools menu -->
<div class="vbmenu_popup" id="usercptools_menu" style="display:none">

Do I just paste the new code above in place of this, or are there more steps I need to take to get the drop down User CP?

[ryanmartin1172]

nevermind, i got it

[Mendi]

Turning the NavBar's Calendar into a Drop Down of all Calendars

Thanks for posting this, Floris. Very good idea!

Since my vBulletin will be utilizing multiple calendars, is there a way to make the "Calendar" link in the NavBar a drop down list which allows a user to go right to a specific calendar? Optimally, I wouldn't have to hard code each calendar in the template (it would automatically show all calendars that the user has permission to see), but I could just hard code the major calendars I suppose...

How would I do this?

[OCH-Stan]

Ohh wow! GREAT HACK!

[CrashPush]

Awesome hack! I love it!