Get active menu link working

I seen a post wanting to get the active link working and have the menu button stay highlighted for the page its showing. With the help of this post i got the thing to work using version 4.2.3, If your using the default template or 2cols template, make a back up and do this:

Go to templates/default/layout.tpl

Replace This: (line 56)

HTML:

<ul>
				<li><a href="{$smarty.const.URL}/index.php">{$smarty.const.LANG_TPL_HOME}</a></li>
				<li><a href="{$smarty.const.URL}/search.php">{$smarty.const.LANG_TPL_SEARCH}</a></li>
				<li><a href="{$smarty.const.URL}/category.php">{$smarty.const.LANG_TPL_BROWSE}</a></li>
				<li><a href="{$smarty.const.URL}/toplistings.php?pg=featured">{$smarty.const.LANG_TPL_FEATURED}</a></li>
				<li><a href="{$smarty.const.URLS}/usercheckout.php">{$smarty.const.LANG_TPL_PLACE_AD}</a></li>
				<li><a href="{$smarty.const.URL}/contactus.php">{$smarty.const.LANG_TPL_CONTACT}</a></li>
			</ul>

With This:

HTML:

<div {if $body=='home.tpl'} class="current"{else}class="taby"{/if}><a href="{$smarty.const.URL}/">{$smarty.const.LANG_TPL_HOME}</a></div>
				<div {if $body=='search.tpl'} class="current"{else}class="taby"{/if}><a href="{$smarty.const.URL}/search.php" >{$smarty.const.LANG_TPL_SEARCH}</a></div>
				<div {if $body=='categories/browse.tpl'} class="current"{else}class="taby"{/if}><a href="{$smarty.const.URL}/category.php" >{$smarty.const.LANG_TPL_BROWSE}</a></div>
				<div class="taby"><a href="{$smarty.const.URL}/toplistings.php?pg=featured">{$smarty.const.LANG_TPL_FEATURED}</a></div>
				<div {if $body=='checkout/step1.tpl'} class="current"{else}class="taby"{/if}><a href="{$smarty.const.URLS}/usercheckout.php">{$smarty.const.LANG_TPL_PLACE_AD}</a></div>
				<div {if $body=='contact/contactus.tpl'} class="current"{else}class="taby"{/if}><a href="{$smarty.const.URL}/contactus.php">{$smarty.const.LANG_TPL_CONTACT}</a></div>

Open your css sheet at templates\default\css\style.css

Find this: (line 26 or 27)

HTML:

#tabs li { display: inline; height: 45px; }
#tabs li a { float: left; background: #fff url(../images/barbg.gif) no-repeat; color: #808080; padding: 7px 0; width: 122px; font-weight: bold; text-align: center;  text-decoration: none; }
#tabs li a:hover { background: #fff url(../images/barcurrent.gif) no-repeat; color: #000; }	
#tabs li a.current { background: #fff url(../images/barcurrent.gif) no-repeat; color: #2C71AE; }	

Replace with this:

HTML:

#tabs .taby { display: inline; height: 45px; }
#tabs .taby a { float: left; background: #fff url(../images/barbg.gif) no-repeat; color: #808080; padding: 7px 0; width: 82px; text-align: center; font-weight: bold; text-decoration: none; }
#tabs .taby a:hover { background: #fff url(../images/barcurrent.gif) no-repeat; color: #000; }
#tabs .current { display: inline; height: 45px; }
#tabs .current a { float: left; background: #fff url(../images/barcurrent.gif) no-repeat; color: #000; padding: 7px 0; width: 82px; text-align: center; font-weight: bold; text-decoration: none; }
#tabs .current a:hover { background: #fff url(../images/barcurrent.gif) no-repeat; color: #000; }

You may have to mess around with it if your using it on a custom or other template or if you have made changes to the default and 2cols template. Works on firefox and IE9 8 7.

As you can see i don't know the body page for the top featured listings, so i left that blank.

Good luck

Your right, I would only use the active menu when it adds to a design even for a few pages. If firefox was the only browser available, it would makes things a bit easier