Hello masters,
Im trying to customize my style a bit more but Im having been able to accomplish.
Whay I need to is to remove the login menu from below the navbar and put it on top of header just like the original vB has it, the problem is I have an image there at the header and the more search and try codes NEVER align on top of the image.
Below is the image of what I want to do and below the image are the codes from the Navbar and the Header in case you guys wonder.
Code:
Header Code
<div id="pageWrapper"><div class="pageWrap">
<div class="above_body"> <!-- closing tag is in template navbar -->
<div id="header" class="floatcontainer doc_header">
<div class="headerLeft"><div class="headerRight">
<vb:if condition="$stylevar['titleimage']"><a name="top" href="{vb:link forumhome}" id="logo"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a></vb:if>
<vb:if condition="$vboptions['movara_banner_header']">
<div class="bannerBox">
<-- Forum Sponsor Start-->
<a href="http://www.sponsordomain.com" target="_blank"><img src="http://domain.com/forums/sponsors/advertise_here2.gif" border="0" alt="Forum Sponsor"></a>
<-- Forum Sponsor End-->
{vb:raw ad_location.global_header1}
</div>
</vb:if>
{vb:raw ad_location.ad_header_end}
</div></div>
</div><!-- closing div for header -->
<div id="navbar" class="navbar">
<div class="navLeft"><div class="navRight">
<a href="http://www.domain.com/forums/" target="_parent"><img src="images/styles/Movara/style/welcome.gif" alt="Forum Home" id="navWelcome" /></a>
<div class="facebook_pure">
<vb:if condition="$vbulletin->options['display_social_icons']==1">
<div class="socialBox">
<vb:if condition="$vbulletin->options['twitter_account']"><a href="http://www.twitter.com/{vb:raw twitter_account}" target="_blank"><img src="images/styles/Movara/style/icon-twitter.png" alt="Follow us on Twitter" /></a></vb:if>
<vb:if condition="$vbulletin->options['facebook_account']"><a href="http://www.facebook.com/{vb:raw facebook_account}" target="_blank"><img src="images/styles/Movara/style/icon-facebook.png" alt="Follow us on Facebook" /></a></vb:if>
<vb:if condition="$vbulletin->options['youtube_account']"><a href="http://www.youtube.com/{vb:raw youtube_account}" target="_blank"><img src="images/styles/Movara/style/icon-youtube.png" alt="Watch us on YouTube" /></a></vb:if>
</div>
</vb:if>
<vb:if condition="$vboptions['enablefacebookconnect']">
<ul>
{vb:raw facebook_header}
</ul>
</vb:if>
</div>
Code:
Navbar Code
<ul id="navtabs" class="navtabs floatcontainer<vb:if condition="$show['member'] AND $notifications_total"> notify</vb:if>">
{vb:raw template_hook.navtab_start}
<vb:if condition="!$vboptions['selectednavtab'] AND THIS_SCRIPT != 'search'">
<li class="selected"><a class="navtab" href="{vb:link forumhome}">{vb:rawphrase forum}</a>
<ul class="floatcontainer">
{vb:raw template_hook.navbar_start}
<vb:if condition="$show['searchbuttons']">
<vb:if condition="$show['member']">
<li><a href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Post">{vb:rawphrase new_posts_nav}</a></li>
<vb:else />
<li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post">{vb:rawphrase todays_posts}</a></li>
</vb:if>
</vb:if>
{vb:raw template_hook.navbar_after_getnew}
<vb:if condition="$show['pmmainlink']">
<li><a href="private.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase private_messages}</a></li>
</vb:if>
{vb:raw template_hook.navbar_after_pm}
<li><a rel="help" href="faq.php{vb:raw session.sessionurl_q}" accesskey="5">{vb:rawphrase faq}</a></li>
{vb:raw template_hook.navbar_after_faq}
<li><a href="calendar.php{vb:raw session.sessionurl_q}">{vb:rawphrase calendar}</a></li>
{vb:raw template_hook.navbar_after_calendar}
<vb:if condition="$show['communitylink']">
<li class="popupmenu">
<a href="javascript://" class="popupctrl" accesskey="6">{vb:rawphrase community}</a>
<ul class="popupbody popuphover">
{vb:raw template_hook.navbar_community_menu_start}
<vb:if condition="$show['quick_links_groups']">
<li><a href="{vb:link grouphome}">{vb:rawphrase social_groups}</a></li>
</vb:if>
<vb:if condition="$show['quick_links_albums']">
<li><a href="album.php{vb:raw session.sessionurl_q}">{vb:rawphrase pictures_and_albums}</a></li>
</vb:if>
<vb:if condition="$bbuserinfo['userid']">
<li><a href="profile.php?{vb:raw session.sessionurl}do=buddylist"><vb:if condition="$show['friends_and_contacts']">{vb:rawphrase contacts_and_friends}<vb:else />{vb:rawphrase contacts}</vb:if></a></li>
</vb:if>
<vb:if condition="$show['memberslist']">
<li><a href="memberlist.php{vb:raw session.sessionurl_q}">{vb:rawphrase members_list}</a></li>
</vb:if>
{vb:raw template_hook.navbar_community_menu_end}
</ul>
</li>
</vb:if>
{vb:raw template_hook.navbar_after_community}
<li class="popupmenu">
<a href="javascript://" class="popupctrl">{vb:rawphrase forum_actions}</a>
<ul class="popupbody popuphover">
<li>
<a href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}forumdisplay.php?{vb:raw session.sessionurl}do=markread&markreadhash={vb:raw bbuserinfo.securitytoken}" onclick="return confirm('{vb:rawphrase mark_forums_read_confirm}')">{vb:rawphrase mark_forums_read}</a>
</li>
<vb:if condition="$show['member']">
<li>
<a href="profile.php?{vb:raw session.sessionurl}do=editoptions">{vb:rawphrase edit_options}</a>
</li>
<li>
<a href="profile.php?{vb:raw session.sessionurl}do=editprofile">{vb:rawphrase edit_your_details}</a>
</li>
</vb:if>
</ul>
</li>
<li class="popupmenu">
<a href="javascript://" class="popupctrl" accesskey="3">{vb:rawphrase quick_links}</a>
<ul class="popupbody popuphover">
<vb:if condition="$show['member']">
<-- Get Daily Post on Quick Links START-->
<li><a href="search.php?do=getdaily&contenttype=vBForum_Post">{vb:rawphrase todays_posts}</a></li>
<-- Get Daily Post on Quick Links END-->
<li><a href="{vb:link subscription}" rel="nofollow">{vb:rawphrase subscribed_threads}</a></li>
<li><a href="javascript://" onclick="window.open(getBaseUrl() + 'misc.php?{vb:raw session.sessionurl}do=buddylist&focus=1','buddylist','statusbar=no,menubar=no,toolbar=no,scrollbars=yes,resizable=yes,width=250,height=300'); return false;">{vb:rawphrase open_contacts}</a></li>
</vb:if>
<vb:if condition="$vboptions['forumleaders']">
<li><a href="showgroups.php{vb:raw session.sessionurl_q}" rel="nofollow">
<vb:if condition="$vb_suite_installed">
{vb:rawphrase view_site_leaders}
<vb:else />
{vb:rawphrase view_forum_leaders}
</vb:if>
</a></li>
</vb:if>
{vb:raw template_hook.navbar_quick_links_menu_pos1}
{vb:raw template_hook.navbar_quick_links_menu_pos2}
{vb:raw template_hook.navbar_quick_links_menu_pos3}
<vb:if condition="$show['wollink']">
<li><a href="online.php{vb:raw session.sessionurl_q}">{vb:rawphrase whos_online}</a></li>
</vb:if>
{vb:raw template_hook.navbar_quick_links_menu_pos4}
</ul>
</li>
{vb:raw template_hook.navbar_end}
</ul>
</li>
<vb:else />
<li><a class="navtab" href="{vb:link forumhome}">{vb:rawphrase forum}</a></li>
</vb:if>
{vb:raw template_hook.navtab_middle}
<vb:if condition="!$vboptions['selectednavtab'] AND THIS_SCRIPT == 'search'">
<vb:if condition="$show['member']">
<li class="selected"><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a>
<ul class="floatcontainer">
<li><a href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Post">{vb:rawphrase new_posts_nav}</a></li>
<li><a href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_SocialGroupMessage">{vb:rawphrase new_group_messages_nav}</a></li>
<li><a href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Event">{vb:rawphrase new_events_nav}</a></li>
{vb:raw template_hook.navbar_getnew_menu}
<li><a href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}forumdisplay.php?{vb:raw session.sessionurl}do=markread&markreadhash={vb:raw bbuserinfo.securitytoken}">{vb:rawphrase mark_forums_read}</a></li>
</ul>
</li>
<vb:else />
<li class="selected"><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a>
<ul class="floatcontainer">
<li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post">{vb:rawphrase todays_posts}</a></li>
<li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_SocialGroupMessage">{vb:rawphrase daily_group_message}</a></li>
<li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Event">{vb:rawphrase daily_events}</a></li>
{vb:raw template_hook.navbar_getdaily_menu}
<li><a href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}forumdisplay.php?{vb:raw session.sessionurl}do=markread&markreadhash={vb:raw bbuserinfo.securitytoken}">{vb:rawphrase mark_forums_read}</a></li>
</ul>
</li>
</vb:if>
<vb:elseif condition="$show['member']" />
<li><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getnew&contenttype=vBForum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a></li>
<vb:else />
<li><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getdaily&contenttype=vBForum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a></li>
</vb:if>
{vb:raw template_hook.navtab_end}
</ul>
<vb:if condition="$vboptions['enablesearches']">
<div class="searchBox">
<form action="search.php?{vb:raw session.sessionurl}do=process" method="post">
<vb:comment><input type="hidden" name="s" value="{vb:raw session.sessionurl}" /></vb:comment>
<input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" />
<input type="hidden" name="do" value="process" />
<div class="searchWrap">
<input class="searchinput" type="text" name="query" tabindex="1004" value="Enter Search Criteria Here" onfocus="if (this.value == 'Enter Search Criteria Here') this.value = '';" onblur="if (this.value == '') this.value = 'Enter Search Criteria Here';" size="23" />
</div>
<span class="searchButton">
<input type="image" src="images/styles/Movara/style/searchButton.gif" value="Search" alt="Submit" />
</span>
</form>
</div>
</vb:if>
</div></div>
</div>
</div><!-- closing div for above_body -->
<vb:if condition="$show['member']">
<div id="midSection2">
<div class="midLeft2"><div class="midRight2">
<vb:else />
<div id="midSection">
<div class="midLeft"><div class="midRight">
</vb:if>
<vb:if condition="$show['member']">
<div id="toplinks" class="toplinks">
<ul class="isuser">
<li><a href="login.php?{vb:raw session.sessionurl}do=logout&logouthash={vb:raw bbuserinfo.logouthash}" onclick="return log_out('{vb:rawphrase sure_you_want_to_log_out}')">{vb:rawphrase log_out}</a></li>
<vb:if condition="$show['registerbutton']">
<li><a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase register}</a></li>
</vb:if>
<li><a href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase user_control_panel}</a></li>
<li><a href="{vb:link member, {vb:raw bbuserinfo}}">{vb:rawphrase your_profile}</a></li>
<-- New PM Icon START -->
<vb:if condition="$bbuserinfo['pmunread']">
<a href="private.php?"><img border="0" src="images/newpm.gif" width="22" height="10"></a>
</vb:if>
<-- New PM Icon END -->
<vb:if condition="$notifications_total">
<li class="popupmenu notifications" id="notifications">
<a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}: <span class="notifications-number"><strong>{vb:raw notifications_total}</strong></span></a>
<ul class="popupbody popuphover">
{vb:raw notifications_menubits}
</ul>
</li>
<vb:else />
<li class="popupmenu nonotifications" id="nonotifications">
<a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}</a>
<ul class="popupbody popuphover">
<li>{vb:rawphrase no_new_messages}</li>
<li><a href="private.php{vb:raw session.sessionurl_q}">{vb:rawphrase inbox}</a></li>
</ul>
</li>
</vb:if>
<li class="welcomelink">{vb:rawphrase welcome_x_link_y, {vb:raw bbuserinfo.username}, {vb:link member, {vb:raw bbuserinfo}}}</li>
<vb:if condition="$vboptions['enablefacebookconnect']">
{vb:raw facebook_header}
</vb:if>
</ul>
{vb:raw template_hook.header_userinfo}
<vb:comment><p>{vb:rawphrase last_visited_x_at_y, {vb:raw pmbox.lastvisitdate}, {vb:raw pmbox.lastvisittime}}</p></vb:comment>
</div>
<vb:else />
<div class="midFirstText"></div>
<div class="loginBox">
<!-- login form -->
<script type="text/javascript" src="clientscript/vbulletin_md5.js?v={vb:raw vboptions.simpleversion}"></script>
<form id="navbar_loginform" action="login.php?{vb:raw session.sessionurl}do=login" method="post" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, {vb:raw show.nopasswordempty})">
<div class="rememberMe">
<label for="cb_cookieuser_navbar"><input type="checkbox" name="cookieuser" value="1" id="cb_cookieuser_navbar" class="cb_cookieuser_navbar" accesskey="c" tabindex="103" /> {vb:rawphrase remember_me}</label>
</div>
<ul>
<li class="userInput"><div class="userBox"><input type="text" class="loginInput<vb:if condition="!$username"> default-value</vb:if>" name="vb_login_username" id="navbar_username" size="10" accesskey="u" tabindex="101" value="<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>" /></div></li>
<li><div class="passBox"><input type="password" class="loginInput" tabindex="102" name="vb_login_password" id="navbar_password" size="10" />
<input type="text" class="loginInput default-value" tabindex="102" name="vb_login_password_hint" id="navbar_password_hint" size="10" value="{vb:rawphrase password}" style="display:none;" /></div></li>
<li><input type="image" src="images/styles/Movara/style/loginButton.gif" tabindex="104" value="Log in" title="Enter your username and password in the boxes provided to login, or click the 'register' button to create a profile for yourself." accesskey="s" /></li>
</ul>
<input type="hidden" name="s" value="{vb:raw session.sessionhash}" />
<input type="hidden" name="securitytoken" value="{vb:raw 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>
<script type="text/javascript">
YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "inline");
YAHOO.util.Dom.setStyle('navbar_password', "display", "none");
vB_XHTML_Ready.subscribe(function()
{
//
YAHOO.util.Event.on('navbar_username', "focus", navbar_username_focus);
YAHOO.util.Event.on('navbar_username', "blur", navbar_username_blur);
YAHOO.util.Event.on('navbar_password_hint', "focus", navbar_password_hint);
YAHOO.util.Event.on('navbar_password', "blur", navbar_password);
});
function navbar_username_focus(e)
{
//
var textbox = YAHOO.util.Event.getTarget(e);
if (textbox.value == '<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>')
{
//
textbox.value='';
textbox.style.color='{vb:stylevar toplinks_form_input.color}';
}
}
function navbar_username_blur(e)
{
//
var textbox = YAHOO.util.Event.getTarget(e);
if (textbox.value == '')
{
//
textbox.value='<vb:if condition="$username">{vb:raw username}<vb:else />{vb:rawphrase username}</vb:if>';
textbox.style.color='{vb:stylevar toplinks_form_input_defaultValue.color}';
}
}
function navbar_password_hint(e)
{
//
var textbox = YAHOO.util.Event.getTarget(e);
YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "none");
YAHOO.util.Dom.setStyle('navbar_password', "display", "inline");
YAHOO.util.Dom.get('navbar_password').focus();
}
function navbar_password(e)
{
//
var textbox = YAHOO.util.Event.getTarget(e);
if (textbox.value == '')
{
YAHOO.util.Dom.setStyle('navbar_password_hint', "display", "inline");
YAHOO.util.Dom.setStyle('navbar_password', "display", "none");
}
}
</script>
<!-- / login form -->
<div class="forgotPasswd"><a href="login.php?do=lostpw">Forgot Password?</a></div>
</div>
<vb:if condition="$show['registerbutton']">
<div class="midSignup"><a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow"><img src="images/styles/Movara/style/button-join.gif" alt="Join Today" /></a></div>
</vb:if>
</vb:if>
</div></div>
</div>
<!-- Custom Content Wrap -->
<div id="contentMain" class="<vb:if condition="$show['member']">contentIn<vb:else />contentOut</vb:if>">
<div class="contentTop"><div class="contentTL"><div class="contentTR">
<div class="contentBL"><div class="contentBR">
<!-- Custom Content Wrap End -->
<div class="body_wrapper">
<div id="breadcrumb" class="breadcrumb">
<div class="bcLeft"><div class="bcRight">
<ul class="floatcontainer">
<li class="navbithome"><a href="index.php{vb:raw session.sessionurl_q}" accesskey="1"><img src="{vb:stylevar imgdir_misc}/navbit-home.png" alt="{vb:rawphrase home}" /></a></li>
{vb:raw navbits.breadcrumb}
{vb:raw navbits.lastelement}
</ul>
<hr />
</div></div>
</div>
<-- Future Location for Custom Menu START -->
<-- Future Location for Custom Menu END -->
{vb:raw ad_location.ad_navbar_below}
{vb:raw ad_location.global_below_navbar}
<vb:if condition="$show['notices'] AND THIS_SCRIPT != 'register'">
<form action="profile.php?do=dismissnotice" method="post" id="notices" class="notices">
<input type="hidden" name="do" value="dismissnotice" />
<input type="hidden" name="s" value="{vb:raw session.sessionurl}" />
<input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" />
<input type="hidden" id="dismiss_notice_hidden" name="dismiss_noticeid" value="" />
<input type="hidden" name="url" value="{vb:raw return_link}" />
<ol>
{vb:raw notices}
</ol>
</form>
</vb:if>
More Information