Website Development

Customize WordPress Search Box and Initial Text

wordpress-search-boxCustomizing the search box in WordPress is pretty straightforward once you understand what file to edit. The form for the search box is defined in searchform.php. Unless your theme has a searchform.php file, your site will revert to the default WordPress searchform.php. To avoid editing the default WordPress template, you can create a searchform.php file within your theme and customize it to your liking. Instructions below:

1) Create a file named searchform.php within your theme (in /wp-content/themes/YOUR_THEME/searchform.php).

2) Copy and paste the below code into the newly created file:

<form id="searchform" method="get" action="<?php bloginfo('url'); ?>/"><input type="text" value="Search this site" onblur="if(this.value == '') {this.value = 'Search this site';}" onfocus="if(this.value == 'Search this site') {this.value = '';}" name="s" id="s" size="25" />

<input type="submit" id="searchsubmit" value="Search" class="submit" name="searchsubmit"/></form>

3) To customize the text that appears in the search box, edit all instances of "Search this site" to whatever you would like to appear. To change the width of the search box, edit the size="25" code to whatever width you would like.

8 Comment on “Customize WordPress Search Box and Initial Text

Leave a Reply

Your email address will not be published. Required fields are marked *