Plugins & Hacks
How to put the search box and search button on the same line
Written and contributed by Frank Truscott (original post).
I am running multiple blogs and wanted to have some where the <%searchform%> would output the search input box and the search button on the same line. See above. But I also wanted to use it with two lines like in the sidebar to the right.
I have found two methods to do this. The first modifies both the SKIN.php file and adds a form template. It's advantage is that you can use just a skinvar call to get the desired effect. The second method was inspired by the comment from Tomas below (see original post). It requires a simple change to the searchform.template and relies on CSS to show or not show the linebreak. Both methods are outlined below.
Method 1
Modification to SKIN.php and add new form template
To do this, I had to make a few changes, but now I can call searchform with a second parameter. Like this:
<%searchform(blog,nlb)%>
where blog is the shortname of the blog to search (default is null, giving current blog) and nlb is 0 or 1, and indicates whether to insert a line break between input box and button (default is null, or 0, which inserts the linebreak. 1 will remove the linebreak)
So <%searchform(,1)%> will search current blog and there will be no linebreak between the input box and the button.
The modifications required are as follows:
I added a template in nucleus/forms called searchform-nlb.template
<!-- template added by ftruscot to allow search button on same line -->
<!-- part of mod to SKIN.php -->
<form method="get" action="<%self%>">
<div class="searchform">
<input name="query" class="formfield" size="10" maxlength="60" accesskey="4" value="<%formdata(query)%>" />
<input type="hidden" name="amount" value="0" />
<input type="hidden" name="blogid" value="<%formdata(id)%>" />
<input type="submit" value="<%text(_SEARCHFORM_SUBMIT)%>" class="formbutton" />
</div>
</form>
Then I modified the parse_searchform function in nucleus/libs/SKIN.php starting around line 1332. It now looks like this:
/** second parameter added to function by ftruscot * to allow flag when calling searchform to keep search input * and Search button on same line * to get no line break call with $nlb=1 * e.g. <%searchform('',1)%> */ function parse_searchform($blogname = '',$nlb = 0) { global $CONF, $manager, $maxresults; if ($blogname) { $blog =& $manager->getBlog(getBlogIDFromName($blogname)); } else { global $blog; } // use default blog when no blog is selected $this->formdata = array( 'id' => $blog?$blog->getID():$CONF['DefaultBlog'], 'query' => htmlspecialchars(getVar('query')), ); if ($nlb) { $this->doForm('searchform-nlb'); } else { $this->doForm('searchform'); } }
Method 2
Template mod and CSS
This method was inspired by the comment from Tomas (see original post). I made a quick modification to the nucleus/forms/searchform.template file to add a class attribute to the <br> tag before the search button. Now my searchform.template looks like this:
<form method="get" action="<%self%>">
<div class="searchform">
<input name="query" class="formfield" size="10" maxlength="60" accesskey="4" value="<%formdata(query)%>" />
<input type="hidden" name="amount" value="0" />
<input type="hidden" name="blogid" value="<%formdata(id)%>" />
<br class="lb" />
<input type="submit" value="<%text(_SEARCHFORM_SUBMIT)%>" class="formbutton" />
</div>
</form>
In my css file, I added the following lines:
.nlb .lb { display:none; } .ylb .lb { display:block; }
And finally, when I make the call of <%searchform%> in my skin, I enclose it in a <div> tag with either class="ylb" (to display the linebreak) or class="nlb" (to hide the linebreak).
i.e. to have the linebreak either call <%searchform%> as normal or like this:
<div class="ylb">
<%searchform%>
</div>
To hide the linebreak, I put the following in my skin:
<div class="nlb">
<%searchform%>
</div>
Original forum thread (thanks, ftruscot!):
http://forum.nucleuscms.org/viewtopic.php?t=13680
Total votes: 2 - Rating: 9.00