MyBB Community Forums

Full Version: Remove search icon from header menu
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hi everyone. 
I've modified header menu template (added link to it), but now I have got a problem. I want to remove search icon next to new link - screenshot:
[Image: fXriEm8.png]
My header template code is:
<div id="container">
		<a name="top" id="top"></a>
		<div id="header">
			<div id="logo">
				<div class="wrapper">
					<a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a>
					<ul class="menu top_links">
						{$menu_portal}
						{$menu_search}
						{$menu_memberlist}
						{$menu_calendar}
						<li><a href="{$mybb->settings['bburl']}/misc.php?action=help" class="help">{$lang->toplinks_help}</a></li>
						<li><a href="misc.php?page=upgrade"><img src="admin\styles\default\images\icons\upgrade.png" alt="" title="" />Upgrade</a></li> 
					</ul>
				</div>
			</div>
			<div id="panel">
				<div class="upper">
					<div class="wrapper">
						{$quicksearch}
						{$welcomeblock}
					<!-- </div> in header_welcomeblock_member and header_welcomeblock_guest -->
				<!-- </div> in header_welcomeblock_member and header_welcomeblock_guest -->
			</div>
		</div>
		<div id="content">
			<div class="wrapper">
				{$pm_notice}
				{$bannedwarning}
				{$bbclosedwarning}
				{$unreadreports}
				{$pending_joinrequests}
				{$awaitingusers}
				<navigation>
				<br />
Can anyone help me? 

Thank you.
your header templates seems fine. can you provide your forum url?
Looks like your menu is posted else where. A link to your forum would help.
It's because every <li> gets a background image through CSS.
http://puu.sh/mHkDg/ca8efd164f.png
You put your own image in the last <li> so it doubles.
This line is the troublemaker:
<li><a href="misc.php?page=upgrade"><img src="admin\styles\default\images\icons\upgrade.png" alt="" title="" />Upgrade</a></li>
You put your own image in a <li> which already gets an background from CSS.

You can try to remove the <li> and </li> tags.
Or you'll have to edit the sprite which is used for the menu options.
Or add extra css to like:
HTML:
<li class="li_nobackground"><a href="misc.php?page=upgrade"><img src="admin\styles\default\images\icons\upgrade.png" alt="" title="" />Upgrade</a></li>

CSS (add to global.css):
.li_nobackground {
background: none;
}
Sorry guys. I cannot provide you link, because forum is running on localhost only atm.
There is "{$menu_calendar}"

However looking at the screen shot I do not see a calendar in the menu.

Try removing "{$menu_calendar}" and tell me what happens.
I know this reply is years later and I'm not sure if you still use the forum. Plus, I'm not sure if you ever got this solved or not but this code will solve your issue. I was having the same problem but as fonta was talking about above, replace <li> with <a then delete </li> at the end. Should look like this:

<a class="li_nobackground"><a href="{$mybb->settings['bburl']}/misc.php?page=upgrade"><img src="admin\styles\default\images\icons\upgrade.png" alt="" title="" /> Upgrade</a>

^ Just copy that code and you should be set. Hope it helps and as well to anyone else reading this looking for a solution. Smile
That was because the op added the link to toplinks section and toplinks images by default use sprite images and are defined to do such in global.css toplinks definitions so you must define a specific image for your added link to override the sprite (ie: the search icon of the toplinks sprite) being called by default .

Ie: just for examples though you would need to edit image and links further to your usages:

<li><a href="{$mybb->settings['bburl']}/misc.php?page=upgrade"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/upgrade.png" alt="" title="Upgrade" />Upgrade</a></li>


Or you can say do it properly and define the image via css similar as all toplinks are in mybb for example defining the link to not display the sprite:

#logo ul.top_links a.upgrade {
	background: url('images/upgrade.png') left no-repeat; 	/* placing image where toplinks sprite would normal be called */
}

<li><a href="{$mybb->settings['bburl']}/misc.php?action=upgrade" class="upgrade" title="Upgrade">Upgrade</a></li>