As explained by Susan, use the layout template. &tplLayout=`yourOwnLayoutTpl`
To get:
<div>
<form id="search" method="post" action="/">
<input type="text" id="box" value="..." class="swap_value" />
<input type="image" src="images/searchbutton.png" id="go" alt="Search" title="Search" />
</form>
</div>
it looks something like these..
Takes the templates/layout.tpl.html template:
[+as.showForm:is=`1`:then=`
<form [+as.formId+] action="[+as.formAction+]" method="post">
<fieldset>
<input type="hidden" name="advSearch" value="[+as.advSearch+]" />
<label for="ajaxSearch_input">
<input id="ajaxSearch_input" class="cleardefault" type="text" name="search" value="[+as.inputValue+]"[+as.inputOptions+] />
</label>
<label for="ajaxSearch_submit">
<input id="ajaxSearch_submit" type="submit" name="sub" value="[+as.submitText+]" />
</label>
</fieldset>
</form>
`+]
[+as.showIntro:is=`1`:then=`
<p class="ajaxSearch_intro" id="ajaxSearch_intro">[+as.introMessage+]</p>
`+]
[+as.showResults:is=`1`:then=`
[+as.results+]
`+]
Customize it to feet your own needs. For instance:
[+as.showForm:is=`1`:then=`
<form [+as.formId+] action="[+as.formAction+]" method="post">
<fieldset>
<input type="hidden" name="advSearch" value="[+as.advSearch+]" />
<label for="ajaxSearch_input">
<input id="ajaxSearch_input" class="cleardefault" type="text" name="search" value="[+as.inputValue+]"[+as.inputOptions+] />
</label>
<label for="ajaxSearch_submit">
<input id="ajaxSearch_submit" type="image" name="sub" src="images/searchbutton.png" />
</label>
</fieldset>
</form>
`+]
[+as.showResults:is=`1`:then=`
[+as.results+]
`+]Here I have replaced the Go button by your image and suppress the introduction message displayed under the search form.
If you are not interesting by the clearDefault option you could also remove the use of the class clearDefault
&clearDefault
clearing default text. (optional) add the class "cleardefault" to your input text form and set this parameter
Don’t remove the placeholders and keep the structure of the template.
And obviously, define the css styles of the input form elements by modifying:
#ajaxSearch_form
#ajaxSearch_input
#ajaxSearch_submit
To style the results page, customize the templates results and result and the parameters &tplResults and tplResult.
☆ A M B ☆
