Need help editing tpl_search_header.php

[smile]

Hello All,

Perhaps, someone can provide the correct syntax

I am trying to modify the /includes/templates/MY_TEMP/sideboxes/tpl_search_header.php

to have HEADER_SEARCH_BUTTON
pick up the CSS id navMain ui li
to match the other links in my header

HOME | LOGIN | CONTACT US | CHECKOUT .. etc

Current line:

$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 . '\';"') . '&nbsp;<input type="submit" value="' . HEADER_SEARCH_BUTTON . '" style="width: 45px" />';


Thanks in advance

[rstevenson]

Those links are getting their style from the stylesheet, but the search button has its style hard-coded in, as you can see. What happens if you remove the hard-coded style? That is, remove this...
size="6" maxlength="30" style="width: 100px"
While being sure to leave in the pips (single apostrophes, sort of) that delineate the pieces of code.

Rob

[smile]

Thanks rstevenson for the reply

Yes, I see that the style is hard coded
the portion "size="6" maxlength="30" style="width: 100px"
is for the input field text box

The second instance of "style" :
style="width: 45px" is the button/and or text
removing this style does not work .
When removed the text/button shift right a couple of pixels.

Also, The form appears to be expecting a class selector, not an id selector

Not clear how to re-write the line so that I have
search input text box followed by HEADER_SEARCH_BUTTON
text definition AND have the HEADER_SEARCH_BUTTON
use the same style as navMain section

Even with firefox/firebug mode its not clear (to me )
where the styling for the area around HEADER_SEARCH_BUTTON
is coming from

thanks in advance for any help

[smile]

Feeling stoooooopid

can't seem to get it right
last try was this ....

$content .= zen_draw_input_field('keyword', '', 'size="6" maxlength="30" style="width: 80px" value="' . HEADER_SEARCH_DEFAULT_TEXT . '\';"') . '&nbsp;<span id="navMainWrapper"><?php echo HEADER_SEARCH_BUTTON; ?></span> . '" style="width: 50px" />';

[rstevenson]

Maybe try the straightforward approach. On my retail site (because I don't use CSS buttons there) the Search button class is "button-search-header". If that class is not already in your stylesheet add it and style it to your preferences. You may need to use the !important declaration to get it to take. If that isn't the class of your search button, find out what class is being used and style that one. It's difficult because of the layers of code involved, but you should be able to do what you want using just the stylesheet.

Given a link to your site, I could experiment directly.

Rob

[smile]

Rob,

Thanks again for your time and input...
I'm feeling pretty stoooopid that I can't figure it out

Actually, I am not using CSS buttons

HEADER_SEARCH_BUTTON is defined in
/languages/english/MY_TEMPLATE/header.php

define('HEADER_SEARCH_BUTTON','Search');

Anyway, if you want to take a look

http://192.217.105.144/fpss/testbed/

The goal is to have the "search" text use the same style
as the other links in the header navigation bar

Thanks again
Regards
Ken

[rstevenson]

Actually, I am not using CSS buttons

In that case, you might as well get rid of the stylesheet for that. It's still being loaded.

HEADER_SEARCH_BUTTON is defined in
/languages/english/MY_TEMPLATE/header.php

define('HEADER_SEARCH_BUTTON','Search');

Change that last bit to 'SEARCH' since the rest of the links are all caps. Then change (in the file that defines the size of the button) 50px to 75px. When I try that (using Firebug in Firefox) it looks right. The text is still black in a white button, but to modify that you may need to switch to a button image.

Rob

[smile]

Hey Rob,

Thanks again for your input ...

When I saw the reply I thought
"That's it ! the *buttons.css must be interfering"
Renamed the *buttons.css , but , still displayed the same ....

I was not able to have the search text element pick up the class
from stylesheet , messed around created new class etc ...

I had to place between the "style" tag in the tpl_search_header.php

$content .= zen_draw_input_field('keyword', '', 'size="6" class="search-header-box" maxlength="30" style="width: 80px" 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 . '\';"') . '&nbsp;<input type="submit" src="" value="'.HEADER_SEARCH_BUTTON.'" style="color: #fff; background-color:#066; border:0px; font-size:130%; text-transform:uppercase; width: 70px;" />';

Now, how to add onMouseover or a hover class to match rest of header?

Any input would be appreciated


Regards
Ken