Nav Bar like vBTeam.

mojopanel · Jan 11, 2009

So the css code.
This is the css code for the navbar...

Code:

/* Header styles */
    #header {
        clear:both;
        float:left;
        width:100%;
    }
    #header ul {
        clear:left;
        float:right;
        width:100%;
        list-style:none;
        margin:0 0 0 10px;
        padding:0;
    }
    #header ul li {
        display:inline;
        list-style:none;
        margin:0;
        padding:0;
    }
    #header ul li input {
        display:inline;
        float:right;
        margin:0 0 0 1px;
        text-align:center;
        background:#eee;
        color:#000;
        text-decoration:none;
        position:relative;
    }
    #header ul li a {
        display:block;
        float:right;
        margin:0 0 0 2px;
        padding:3px 10px;
        text-align:center;
        background:#dee4ee;
        color:#000;
        text-decoration:none;
        position:relative;
        right:15px;
        line-height:1.3em;
    }
    #header ul li a:hover {
        background:#369;
        color:#fff;
    }

Now find the template NAVBAR save a copy of your old one so you can change back if you need to....

Code:

<br />
<!-- nav buttons bar -->
<div id="header"> 
<ul> 
<li> 
<form action="search.php?do=process" method="post" name="vbform" id="searchform" style="display:block; margin:5px"> 
<input type="hidden" name="s" value="" /> 
<input type="hidden" name="securitytoken" value="$bbuserinfo[securitytoken]" /> 
<input type="hidden" name="do" value="process" /> <input type="hidden" name="searchthreadid" value="" /> 
<input type="text" class="bginput" name="query" size="36" tabindex="1001" value="To search, just type and hit enter." onFocus="value='';"/></form> 
</li> 
<!-- Other Stuff -->

<!-- /Other Stuff -->
<!-- new posts -->
<if condition="$show['member']"></if>
<if condition="$show['member']"><li><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></li>
<else />
<li><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></li>
</if>
<!-- /new posts -->
<!-- Reg/usecp -->
<if condition="$show['member']">
  <li><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_cp]</a></li>
</if>
<if condition="$show['registerbutton']">
  <li><a href="register.php$session[sessionurl_q]" rel="nofollow">$vbphrase[register]</a></li>
</if>
<!-- /Reg/usecp -->
<!-- Community -->
<if condition="$show['communitylink'] AND $show['popups']">
  <li><a id="community" href="$show[nojs_link]#community" rel="nofollow" accesskey="6">$vbphrase[community]</a> 
      <script type="text/javascript"> vbmenu_register("community"); </script>
  </li>
  <else />
  <if condition="$vboptions['enablememberlist']">
    <li><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></li>
  </if>
  <if condition="$show['quick_links_groups']">
    <li><a href="group.php?$session[sessionurl]">$vbphrase[social_groups]</a></li>
  </if>
</if>
<!-- /Community -->
<!-- Quick Links -->
<if condition="$show['member']">
  <li><a id="usercptools" href="$show[nojs_link]#usercptools" accesskey="3">$vbphrase[quick_links]</a> 
      <script type="text/javascript"> vbmenu_register("usercptools"); </script>
  </li>
</if>
<!-- /Quick Links -->
<!-- Home -->
<li><a href="index.php">Index</a></li>
<!-- /Home -->
</ul> 
</div> 
<!-- / nav buttons bar -->
<br />
<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)">
            <table cellpadding="0" cellspacing="0" border="0">
            <tr valign="bottom">
                <td><a href="#" onClick="history.back(1); return false;"><img src="$stylevar[imgdir_misc]/navbits_start.gif" alt="$vbphrase[go_back]" border="0" /></a></td>
                <td>&nbsp;</td>
                <td width="100%"><span class="navbar"><a href="$vboptions[forumhome].php$session[sessionurl_q]" accesskey="1">$vboptions[bbtitle]</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_$stylevar[textdirection].gif" alt="" border="0" /><else /><a href="$navbar_reloadurl"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_finallink_$stylevar[textdirection].gif" alt="$vbphrase[reload_this_page]" border="0" /></a></if> <strong>$navbits[lastelement]</strong></td>
            </tr>
            </table>
        <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" nowrap="nowrap">
    <div class="smallfont">
        <strong><phrase 1="$bbuserinfo[username]" 2="member.php?$session[sessionurl]u=$bbuserinfo[userid]">$vbphrase[welcome_x_link_y]</phrase></strong><br />
<if condition="$bbuserinfo['pmunread']">
    <a href="private.php?"><img border="0" src="images/newpm.gif" width="22" height="10"></a>
    </if>
        <phrase 1="$pmbox[lastvisitdate]" 2="$pmbox[lastvisittime]">$vbphrase[last_visited_x_at_y]</phrase>
<div><a href="search.php?do=getdaily" >Today's Posts</a> | <a href="forumdisplay.php?do=markread">Mark Forums Read</a></div>
        <if condition="$show['notifications']">
            <div><span id="notifications"><a href="usercp.php$session[sessionurl_q]">$vbphrase[your_notifications]:</a> <strong>$notifications_total</strong></span></div>
            <if condition="$show['popups']">
                <script type="text/javascript"> vBmenu.register("notifications"); </script>
            <else />
                <script type="text/javascript" src="clientscript/vbulletin_notifications_nopopups.js?v=$vboptions[simpleversion]"></script>
                <script type="text/javascript"> vBulletin.register_control("vB_Notifications_NoPopups", "notifications");  </script>
            </if>
        <else /><if condition="$show['pmstats']">
            <div><phrase 1="$vbphrase[unread_x_nav_compiled]" 2="$vbphrase[total_x_nav_compiled]" 3="$session[sessionurl_q]">$vbphrase[private_messages_nav]</phrase></div>
        </if></if>

        <if condition="$show['pmwarning']"><div><strong><phrase 1="$vbphrase[pmpercent_nav_compiled]">$vbphrase[your_pm_box_is_x_full]</phrase></strong></div></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" style="white-space: nowrap;"><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" 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="securitytoken" value="$bbuserinfo[securitytoken]" />
        <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 -->

<!-- / nav buttons bar -->

<br />

<if condition="$show['notices']">
<form action="profile.php?do=dismissnotice" method="post" id="notices">
<input type="hidden" name="do" value="dismissnotice" />
<input type="hidden" name="securitytoken" value="$bbuserinfo[securitytoken]" />
<input type="hidden" id="dismiss_notice" name="dismiss_notice" value="" />
<input type="hidden" name="url" value="$return_link" />


    <table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
    <tr>
        <td class="thead">$vbphrase[notices]</td>
    </tr>
    <tr>
        <td class="alt1">
            $notices
        </td>
    </tr>
    </table>
    <br />
</form>
</if>

<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 -->

    <if condition="$show['communitylink']">
    <!-- community link menu -->
    <div class="vbmenu_popup" id="community_menu" style="display:none;margin-top:3px" align="$stylevar[align=left]">
        <table cellpadding="4" cellspacing="1" border="0">
        <tr><td class="thead">$vbphrase[community_links]</td></tr>
        $template_hook[navbar_community_menu_start]
        <if condition="$show['quick_links_groups']">
                    <tr><td class="vbmenu_option"><a href="group.php$session[sessionurl_q]">$vbphrase[social_groups]</a></td></tr>
        </if>
        <if condition="$show['quick_links_albums']">
                    <tr><td class="vbmenu_option"><a href="album.php$session[sessionurl_q]">$vbphrase[pictures_and_albums]</a></td></tr>
        </if>
        <tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=buddylist"><if condition="$show['friends_and_contacts']">$vbphrase[contacts_and_friends]<else />$vbphrase[contacts]</if></a></td></tr>
        <tr><td class="vbmenu_option"><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></td></tr>
        $template_hook[navbar_community_menu_end]
        </table>
    </div>
    <!-- / community link menu -->
    </if>
    
    <if condition="$show['searchbuttons']">
    <!-- header quick search form -->
    <div class="vbmenu_popup" id="navbar_search_menu" style="display:none;margin-top:3px" align="$stylevar[align=left]">
        <table cellpadding="4" cellspacing="1" border="0">
        <tr>
            <td class="thead">$vbphrase[search_forums]</td>
        </tr>
        <tr>
            <td class="vbmenu_option" title="nohilite">
                <form action="search.php?do=process" method="post">

                    <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]" />
                    <input type="hidden" name="securitytoken" value="$bbuserinfo[securitytoken]" />
                    <div><input type="text" class="bginput" name="query" size="25" tabindex="1001" /><input type="submit" class="button" value="$vbphrase[go]" tabindex="1004" /></div>
                    <div style="margin-top:$stylevar[cellpadding]px">
                        <label for="rb_nb_sp0"><input type="radio" name="showposts" value="0" id="rb_nb_sp0" tabindex="1002" checked="checked" />$vbphrase[show_threads]</label>
                        &nbsp;
                        <label for="rb_nb_sp1"><input type="radio" name="showposts" value="1" id="rb_nb_sp1" tabindex="1003" />$vbphrase[show_posts]</label>
                    </div>
                </form>
            </td>
        </tr>
        <if condition="$vboptions[threadtagging]">
        <tr>
            <td class="vbmenu_option"><a href="tags.php$session[sessionurl_q]" rel="nofollow">$vbphrase[tag_search]</a></td>
        </tr>
        </if>
        <tr>
            <td class="vbmenu_option"><a href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[advanced_search]</a></td>
        </tr>
        $template_hook[navbar_search_menu]
        </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;margin-top:3px" align="$stylevar[align=left]">
        <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_contacts]</a></td></tr>

        $template_hook[navbar_quick_links_menu_pos1]
        $template_hook[navbar_quick_links_menu_pos2]

        <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_your_details]</a></td></tr>
        <tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editoptions">$vbphrase[edit_options]</a></td></tr>
        $template_hook[navbar_quick_links_menu_pos3]

        <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[your_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>
        $template_hook[navbar_quick_links_menu_pos4]

        </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['member'] AND     $notifications_total">
<!-- notifications menu -->
<div class="vbmenu_popup" id="notifications_menu" style="display:none">
    <table cellpadding="4" cellspacing="1" border="0">
    <tr><td class="thead" colspan="2">$vbphrase[your_notifications]</td></tr>
    $notifications_menubits
    </table>
</div>
<!-- / notifications menu -->
</if>

$ad_location[ad_navbar_below]
<!--{%SHOUTBOX%}-->
$template_hook[navbar_below]

THIS IS FOR vBulletin 3.8.X
You will need to edit your self ( or ask kindly for some one on here to edit for you)

SCREEN SHOT: YOU DON'T NEED ONE
DEMO: YER, LOOK ABOVE YOU AT THE TOP OF THE PAGE

(I bet some one will still ask for a demo..)

mojopanel · Jan 11, 2009

Also, you can make it so your gusts can see the vBulletin copyright but members can not..

right all you do is edit your footer template

SAVE A COPY OF YOUR FOOTER CODE AS YOU MIGHT WHAT TO CHANGE IT BACK

Code:

$ad_location[ad_footer_start]

<br />
<div class="smallfont" align="center">$vbphrase[all_times_are_gmt_x_time_now_is_y]</div>
<!-- /content area table -->

<div align="center">
	<div class="smallfont" align="center">
	<if condition="$show['guest']"> 
	<!-- Do not remove this copyright notice -->
	$vbphrase[powered_by_vbulletin]
	<!-- Do not remove this copyright notice -->
	</if> 
	</div>
	
	<div class="smallfont" align="center">
	<if condition="$show['member']">  
	<!-- Do not remove $cronimage or your scheduled tasks will cease to function -->
	$cronimage
	<!-- Do not remove $cronimage or your scheduled tasks will cease to function --> 
    </if>
	</div>
</div>
$ad_location[ad_footer_end]
$spacer_close
<form action="$vboptions[forumhome].php" method="get" style="clear:$stylevar[align=left]">

<table cellpadding="$stylevar[cellpadding]" cellspacing="0" border="0" width="$stylevar[outertablewidth]" class="page" align="center">
<tr>
	<if condition="$show['quickchooser']">
		<td class="tfoot">
			<select name="styleid" onChange="switch_id(this, 'style')">
				<optgroup label="$vbphrase[quick_style_chooser]">
					$quickchooserbits
				</optgroup>
			</select>
		</td>
	</if>
	<if condition="$show['languagechooser']">
		<td class="tfoot">
			<select name="langid" onChange="switch_id(this, 'lang')">
				<optgroup label="$vbphrase[quick_language_chooser]">
					$languagechooserbits
				</optgroup>
			</select>
		</td>
	</if>
	<td class="tfoot" align="$stylevar[align=right]" width="100%">
		<div class="smallfont">
			<strong>
 <a href="javascript:bookmarksite('$vboptions[bbtitle]', '$vboptions[bburl]')">Bookmark Us!</a> -  
				<if condition="$show['contactus']"><a href="$vboptions[contactuslink]" rel="nofollow" accesskey="9">$vbphrase[contact_us]</a> -</if>
				<if condition="$vboptions['hometitle']"><a href="$vboptions[homeurl]">$vboptions[hometitle]</a> -</if>
				<if condition="$show['admincplink']"><a href="$admincpdir/index.php$session[sessionurl_q]">$vbphrase[admin]</a> -</if>
				<if condition="$show['modcplink']"><a href="$modcpdir/index.php$session[sessionurl_q]">$vbphrase[mod]</a> -</if>
				<if condition="$vboptions['archiveenabled']"><a href="archive/index.php">$vbphrase[archive]</a> -</if>
				$template_hook[footer_links]
				<if condition="$vboptions[privacyurl]"><a href="$vboptions[privacyurl]">$vbphrase[privacy_statement]</a> -</if>
				<if condition="$vboptions[tosurl]"><a href="$vboptions[tosurl]">$vbphrase[terms_of_service]</a> -</if>
				<a href="#top" onClick="self.scrollTo(0, 0); return false;">$vbphrase[top]</a>
			</strong>
		</div>
	</td>
</tr>
</table>


</form>

<if condition="$show['dst_correction']">
<!-- auto DST correction code -->
<form action="profile.php?do=dst" method="post" name="dstform">
	<input type="hidden" name="s" value="$session[sessionhash]" />
	<input type="hidden" name="securitytoken" value="$bbuserinfo[securitytoken]" />
	<input type="hidden" name="do" value="dst" />
</form>
<script type="text/javascript">
<!--
	var tzOffset = $bbuserinfo[timezoneoffset] + $bbuserinfo[dstonoff];
	var utcOffset = new Date().getTimezoneOffset() / 60;
	if (Math.abs(tzOffset + utcOffset) == 1)
	{	// Dst offset is 1 so its changed
		document.forms.dstform.submit();
	}
//-->
</script>
<!-- / auto DST correction code -->

</if>
<script type="text/javascript">
<!--
	// Main vBulletin Javascript Initialization
	vBulletin_init();
//-->
</script>

That is the new footer code to make it so, guests see the copyright but members do not..

bousaid · Jan 11, 2009

gooood thanx...

mojopanel · Jan 11, 2009

Welcome, i am trying to make this into a product so people can upload it and add link's to it via the admincp..

h@ck3r · Jan 13, 2009

mojopanel said:
Welcome, i am trying to make this into a product so people can upload it and add link's to it via the admincp..

That would be FANTASTIC.

But in the meantime, where do I put the CSS coding that you have given?

And will this work with VBulletin 3.7.5? (I've not upgraded as I'm scared it might ruin my forums).

Thanks

Nav Bar like vBTeam.

mojopanel

New Member

mojopanel

New Member

bousaid

New Member

mojopanel

New Member

h@ck3r

New Member