Remove Search Button and add text to input field

Hi all
I'd like to remove the search button and have the word Search as default in the input field that will be overwritten when a user types.

I've had a dig around in the search_header.phps but at my current experience there's too much going on in there and i'm drowning in code i don't reconise yet : )
Any ideas?
Thanks, Steve

Any suggestions anyone?
: )

plenty of people reading this. Any suggestions?

You mean kind of like I did on my site? If so I may just be able to help you...

Eclectica Clothing - Where Art Meets Fashion

cool site khopek. Yes, how'd u do that?

To change the text:

in /includes/languages/english/YOURTEMPLATE/header.php and find

define('HEADER_SEARCH_DEFAULT_TEXT', 'Input search term and press Enter');

My search bar says 'Input search term and press Enter'...Yours will say something else
Change that text to whatever you want.

Then to remove the button in

/includes/templates/YOURTEMPLATE/sideboxes/tpl_search_header.php

find

. ' <input type="submit" value="' . HEADER_SEARCH_BUTTON . '" style="width: 45px" />'

and delete it. Be sure to leave the ';' (semicolon) and '}' (curly bracket) at the end of this line in tact or you'll get an error.

Original tpl_search_header.php

<?php /** * Side Box Template * * @package templateSystem * @copyright Copyright 2003-2006 Zen Cart Development Team * @copyright Portions Copyright 2003 osCommerce * @license <http://www.zen-cart.com/license/2_0.txt> GNU Public License V2.0 * @version $Id: tpl_search_header.php 4142 2006-08-15 04:32:54Z drbyte $ */ $content = ""; $content .= zen_draw_form('quick_find_header', zen_href_link(FILENAME_ADVANCED_SEARCH_RESULT, '', 'NONSSL', false), 'get'); $content .= zen_draw_hidden_field('main_page',FILENAME_ADVANCED_SEARCH_RESULT); $content .= zen_draw_hidden_field('search_in_description', '1') . zen_hide_session_id(); if (strtolower(IMAGE_USE_CSS_BUTTONS) == 'yes') { $content .= zen_draw_input_field('keyword', '', 'size="6" maxlength="30" style="width: 100px" value="' . HEADER_SEARCH_DEFAULT_TEXT . '" onfocus="if (this.value == \'' . HEADER_SEARCH_DEFAULT_TEXT . '\') this.value = \'\';" onblur="if (this.value == \'\') this.value = \'' . HEADER_SEARCH_DEFAULT_TEXT . '\';"') . ' ' . zen_image_submit (BUTTON_IMAGE_SEARCH,HEADER_SEARCH_BUTTON); } else { $content .= zen_draw_input_field('keyword', '', 'size="6" maxlength="30" style="width: 100px" value="' . HEADER_SEARCH_DEFAULT_TEXT . '" onfocus="if (this.value == \'' . HEADER_SEARCH_DEFAULT_TEXT . '\') this.value = \'\';" onblur="if (this.value == \'\') this.value = \'' . HEADER_SEARCH_DEFAULT_TEXT . '\';"') . ' <input type="submit" value="' . HEADER_SEARCH_BUTTON . '" style="width: 45px" />'; } $content .= "</form>"; ?>

If you want to adjust height, width, or anything else regarding the search bar, you HAVE to do it in this file. You'll see where it says style=" width: 100px;". You can change that to what you want and add other stlye properties to it, such as height, etc...

If you want a background image, like I have, that has to be done in the stylesheet. Mine looks like this:

.navMainSearch input, .navMainSearch input:focus {
background-color: transparent;
background-image:url(../images/searchBg.gif);
background-repeat: no-repeat;
background-position: top right;
border: none;
text-align: right;
}

Hope that helps!

Fantastic! That worked ... and my next question would have been about the background image.
Well anticipated lol
Thanks for that lot Khopek

To make this thread complete, because of my admin settings, I had to remove both occurrences of the line. ie from before and after the else as highlighted below.
: ), Steve

<?php /** * Side Box Template * * @package templateSystem * @copyright Copyright 2003-2006 Zen Cart Development Team * @copyright Portions Copyright 2003 osCommerce * @license <http://www.zen-cart.com/license/2_0.txt> GNU Public License V2.0 * @version $Id: tpl_search_header.php 4142 2006-08-15 04:32:54Z drbyte $ */ $content = ""; $content .= zen_draw_form('quick_find_header', zen_href_link(FILENAME_ADVANCED_SEARCH_RESULT, '', 'NONSSL', false), 'get'); $content .= zen_draw_hidden_field('main_page',FILENAME_ADVANCED_SEARCH_RESULT); $content .= zen_draw_hidden_field('search_in_description', '1') . zen_hide_session_id(); if (strtolower(IMAGE_USE_CSS_BUTTONS) == 'yes') { $content .= zen_draw_input_field('keyword', '', 'size="6" maxlength="30" style="width: 100px" value="' . HEADER_SEARCH_DEFAULT_TEXT . '" onfocus="if (this.value == \'' . HEADER_SEARCH_DEFAULT_TEXT . '\') this.value = \'\';" onblur="if (this.value == \'\') this.value = \'' . HEADER_SEARCH_DEFAULT_TEXT . '\';"') . ' ' . zen_image_submit (BUTTON_IMAGE_SEARCH,HEADER_SEARCH_BUTTON); } else { $content .= zen_draw_input_field('keyword', '', 'size="6" maxlength="30" style="width: 100px" value="' . HEADER_SEARCH_DEFAULT_TEXT . '" onfocus="if (this.value == \'' . HEADER_SEARCH_DEFAULT_TEXT . '\') this.value = \'\';" onblur="if (this.value == \'\') this.value = \'' . HEADER_SEARCH_DEFAULT_TEXT . '\';"') . ' <input type="submit" value="' . HEADER_SEARCH_BUTTON . '" style="width: 45px" />'; } $content .= "</form>"; ?>

Also...and I found this out after changing some of my layout...I had to change my stylesheet for the background image to ID's instead of CLASSES.

so instead of

.navMainSearch input, .navMainSearch input:focus

i had to change it to

#navMainSearch input, #navMainSearch input:focus

Not sure why that changed on me, but just in case I thought I'd let you know.