Header tabs

jdab

Madly Diligent
Joined
Aug 29, 2010
Messages
9,642
Reaction score
1
FP$
21
We have a theme, and as you can see at the top, there are tabs (User CP etc.):
uhh9xDO.webp

I am looking to add more tabs on the LEFT, with small images in them (for social sites), like this (excuse the poor edit, I did it in 10 seconds):
WtKg0ibh.webp

Any ideas?
 
Moneyman said:
Can you post your header template here please?
The tabs are in header_welcomeblock_member, so here it is:
Code:
<div class="mainwrap">
<div class="top_bar">
	<ul>
		<li><a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}" class="top_bar_lout"><span>{$lang->welcome_logout}</span></a></li>
		{$admincplink}
		{$modcplink}
		<li><a href="{$mybb->settings['bburl']}/usercp.php" class="top_bar_ucp"><span>{$lang->welcome_usercp}</span></a></li>
	</ul>
</div>
<div class="header_main"><div class="header_left"><div class="header_right">
			<div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
			<div class="header_side"><div id="panel">
<div style="background: transparent url({$mybb->user['avatar']}) 0 0 no-repeat;width:68px;height:68px;float:left"></div>
				<div class="panel_wrap">
					{$lang->welcome_back}
				</div>
			</div></div>
			<div class="clear"></div>
		</div></div></div>
		<div id="navbar">
			<ul id="nav">
				<li><a href="{$mybb->settings['bburl']}">Home</a></li>
				<li><a href="{$mybb->settings['bburl']}/memberlist.php">{$lang->toplinks_memberlist}</a></li>
				<li><a href="{$mybb->settings['bburl']}/misc.php?action=help">{$lang->toplinks_help}</a></li>
			</ul>
			<div id="search">
			<form action="{$mybb->settings['bburl']}/search.php" method="post">
				<div class="search_input_wrap"><input name="keywords" class="nav_search_input" title="Enter your search keywords" type="text" /></div>
				<input value="" name="submit-search" class="nav_search_button" type="submit" />
				<input type="hidden" name="action" value="do_search" />
			</form>
			</div>
			<div class="clear"></div>
		</div>
	</div>
</div>
<div id="container"><div class="container_wrap">
	<div class="mainwrap">
		<div class="subnav">
			<div class="float_right"><a href="{$mybb->settings['bburl']}/search.php">Advanced {$lang->toplinks_search}</a></div>
			<a href="{$mybb->settings['bburl']}/search.php?action=getnew">{$lang->welcome_newposts}</a> | <a href="{$mybb->settings['bburl']}/search.php?action=getdaily">{$lang->welcome_todaysposts}</a> | <a href="#" onclick="MyBB.popupWindow('{$mybb->settings['bburl']}/misc.php?action=buddypopup', 'buddyList', 350, 350);">{$lang->welcome_open_buddy_list}</a> | <a href="{$mybb->settings['bburl']}/private.php">{$lang->welcome_pms}</a> {$lang->welcome_pms_usage}<!-- ProfileComments --> | <a href="{$mybb->settings['bburl']}/member.php?action=profile&uid={$mybb->user['uid']}" title="{$lang->profile_comments}">{$lang->profile_comments_new_inmenu}</a> {$lang->profile_comments_new_inmenu_count}<!-- /ProfileComments --> | <a href="http://blogpromotion.net/newpoints.php">BP Bucks</a>
		</div>
 
Copy the CSS class:

top_bar

Rename it to a different name and edit it to float left and put:

Code:
<div class="NEW NAME">your code</div>

Above:

Code:
<div class="top_bar">
   <ul>
      <li><a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}" class="top_bar_lout"><span>{$lang->welcome_logout}</span></a></li>
      {$admincplink}
      {$modcplink}
      <li><a href="{$mybb->settings['bburl']}/usercp.php" class="top_bar_ucp"><span>{$lang->welcome_usercp}</span></a></li>
   </ul>
</div>

I haven't tested it but those tabs are using the top_bar class and I assume you can just copy and edit the CSS.

If you put that code in: header_welcomeblock_member, only members will see it.
 
Back
Top Bottom