Page 1 of 1

search module - use of search template

Posted: Sun Oct 22, 2006 9:18 pm
by coroico
I would like customize the search form of the search module.

The search template associated with the module is :

{$startform}

{$label}: {$inputbox}{$submitbutton}{$hidden}

{$endform}

How, by css, can i modify the design of this form ? What is the meaning of these varaibles ($label, $inputbox, ...)
Thanks in advance for your answer

Re: search module - use of search template

Posted: Mon Oct 23, 2006 11:06 am
by pralay
Hi,
same problem with me.
I also want edit the css and actually make the textbox small in length and change submit button.
How I can do that?
Please anyone help.

Re: search module - use of search template

Posted: Mon Oct 23, 2006 1:54 pm
by Ted
The trick for these kinds of module forms is to wrap the templates up in divs, spans, etc that you can then target with css.

Doing something like:

Code: Select all

<div id="MySearch">
{$startform}

{$label}: {$inputbox}{$submitbutton}{$hidden}

{$endform}
</div>
or even in your page template....

Code: Select all

<div id="MySearch">{search}</div>
Now you can just hit it with CSS.

Code: Select all

#MySearch input {
  width: 25em;
}
Those variables ({$label}, {$input}) are just pieces of html created in the module itself.  They just get spit out as regular text or an input box, submit button, etc.  You can do a view source on the page to see.

(I'm not sure if the css is right...  I'm no expert.  But you get the idea.)

Re: search module - use of search template

Posted: Tue Oct 24, 2006 7:31 am
by pralay
Hi,
maintaining the width in div can not change the textbox size within because there is a size specified in the tag of the textbox that is generated by the variable.
How can I change the width of the textbox?

Re: search module - use of search template

Posted: Wed Nov 01, 2006 6:47 am
by ripcurlksm
maintaining the width in div can not change the textbox size within because there is a size specified in the tag of the textbox that is generated by the variable.
How can I change the width of the textbox?
I need to do this too! Can someone help?

Re: search module - use of search template

Posted: Wed Nov 01, 2006 5:18 pm
by tsw
using


{search}


and css

div#search input {
width:5em;
}

works here.