Search Box Anywhere

This code can be used to install a CSS style search box anywhere on a OSCommerce shopping cart. It uses OSCommerce functions and clears when clicked on.

Paste this code where you would like to have the search box:
<div class="search-box">
<?php echo tep_draw_form('quick_find', tep_href_link(FILENAME_ADVANCED_SEARCH_RESULT, '', 'SSL', false), 'get'); ?>
<input type=text name="keywords" size="10" maxlength="25" class="search-field" value="Search..." onclick="this.value='';" onblur="if(!this.value) {this.value='Search...'; }">
<input type="hidden" name="search_in_description" value="1" />
<input type="hidden" name="inc_subcat" value="1" />
<?php echo tep_hide_session_id() .'<input type="submit" name="search" value="" class="search-go" border="0" width="79" height="25">';?>

Add this to your style sheet:
.search-box{ /*outer background*/float:right; height: 26px; padding: 10px 10px 0px 10px; }{ /*input field */ color:#999999; float: left; border:1px dotted #CCCCCC; border-width: 1px 0px 1px 1px; margin:0; padding: 3px 0px 0px 4px; height:16px; width: 92px; } { /*search icon */ float:left; border:1px solid #CCCCCC; border-width: 1px 1px 1px 0px; margin:0; padding:0; margin-left: 0px; height: 21px; width: 21px; background: #F2F2F2 url(img/icon-search.png) no-repeat top left; cursor: pointer; }{ /*search icon hover "Does Not work in ie6" */ background:url(images/icon-search.png) no-repeat bottom left; }

Now upload this icon,
search icon
to the ‘images’ folder on your site.