View Full Version : How do you customize a search form?
shyflower
07-31-2007, 02:16 PM
I'm on wordpress 2.0 (I think!) and use the widgets panel for my sidebar.
All the other widgets are customizable but the search widget is not and you can't remove it.
I've tried to modify the search box using the Word Press documentation, but the only thing I could do was put a horrible one color background behind it (which I immediately removed again!)
I want to change the submit button to go... and Put it to the right of the box and I want to put a label atop the box. Am I asking too much here? :confused:
Jeremy
07-31-2007, 03:41 PM
I use this for my search form and it eliminates the need for an actual clickable button and the description of what it is sits right in the search box. You can see it down in the footer of my site. Other than that, I really have no idea how to customize anything, just throwing this style out there as an example
<form id="searchform" method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<input type="text" value="To search, type and hit enter..." name="s" id="s" onfocus="if (this.value == 'To search, type and hit enter...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'To search, type and hit enter...';}" />
</form>
shyflower
07-31-2007, 04:03 PM
Thanks jeremy. Looks like a nice code snippet, but the thing is I can't remove the widgets one, so if I used your code, I think I would end up with two search forms.
Jeremy
07-31-2007, 04:09 PM
Hmm, I'm not familiar with widgets, so I guess I can't be of much assistance.
BPartch
07-31-2007, 04:57 PM
Hello
I am not so familiar with widgets eitehr. :(
In your themes folder located in /wp-content/themes/your-theme-name/ There is a file named searchform.php this has the code for the searchform.
If you open this file in a text editor and change this (make sure it looks something like this):
<form id="searchform" method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<div>
<input type="text" name="s" id="s" size="15" /><br />
<input type="submit" value="Search" />
</div>
</form>
to:
<form id="searchform" method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<div>
<label for="s">Search</label><br />
<input type="text" name="s" id="s" size="15" /><br />
<input type="submit" value="Go" />
</div>
</form> That should fix the issues you are having.
Hope it helps. :)
shyflower
07-31-2007, 07:46 PM
Hello
That should fix the issues you are having.
Hope it helps. :)
You'd think so, but when I did it, nothing happened. :( That's actually what the WP documentation tells you to do, but I think the widgets panel messes with it.
One thing I have noticed in my source code is that the search begins with
<li id="search" class="widget widget_search">
Although I have looked through my complete WP installation (well the parts I am using anyway) I can't find a style sheet that has that class "widget widget-search">
I'm thinking it may be something in that class that is somehow messing up the cascade and keeping me from altering the search box.
Of course, I also think that my PC has little gnomes who live inside and screw things up at night.....
shyflower
07-31-2007, 08:12 PM
I finally found where to fix it. You need the wp-includes directory that is in your root and the widgets.php file. Then it works.
Thanks Ben! Your encouragement gave me hope! :D
vBulletin® v3.7.2, Copyright ©2000-2008, Jelsoft Enterprises Ltd.