MOD: quick search-box

A few people asked for this hack and i had a few mins. left:

Its about the same principle as the Authentication Mod.

You’ll loose the (always visible) search-input and get it back only when

clicked on a new search button, like this:


Click the button to toggle visibility of the quick-search-box.

Again, its a quick & dirty one, tested in the lite_orange-skin

and only in version 1.3.4. Help each other out to get some dots on

the i in your case concerning layout and stuff…

4 very easy/fast steps:

[COLOR=“Red”]STEP 1:


Open file [COLOR=“red”]skins//customer/top_menu.tpl[/COLOR]

[COLOR=“seagreen”]a.[/COLOR]Add (thus insert) beneath the 1st line:


{include file=“side_boxes/search.tpl”}


[COLOR=“SeaGreen”]b.[/COLOR]Around line 18 there’s a [COLOR=“Blue”]colspan=“16”[/COLOR] or something. increase the 16 with 2

so it reads [COLOR=“blue”]


Add this code where you want the button. If you look closely you can see

it fits anywhere in there to your needs. Paste this code inbetween 2 buttons:


{assign var=“active” value=“”}

{assign var=“on_click” value=“”}

{include file=“buttons/top_menu_button.tpl” but_content=“$”}


[COLOR=“Red”]STEP 2:


Open file [COLOR=“red”]skins//customer/top.tpl[/COLOR]

Around line 17 or so you can read:

{include file="side_boxes/search.tpl"}

replace this with

[COLOR=“Red”]STEP 3:


Open file [COLOR=“red”]skins//customer/styles.css[/COLOR]

Add at the [COLOR=“blue”]bottom[/COLOR]

.quicksearch_box {
position: absolute;
border:1px solid #cccccc;

[COLOR=“Red”]STEP 4:


Open file [COLOR=“red”]skins//customer/side_boxes/search.tpl[/COLOR]

Somewhere at the bottom you see:


Adjust all styles (top. left etc) that you made in step 3 to your own likes (higher, lower, bordercolor, etc…)

Again, this was quick&dirty, so corrections below please :stuck_out_tongue:


Hi nwsco

Nice one, THX