Quick Tip – Changing the WordPress Search Form to HTML5 – Free Plugin

It kind of sucks the new WordPress 3’s search form is not HTML 5 when the Twenty10 Theme is. Our new search form will look like the below in Safari.

To make the search form HTML 5, add the following to the functions file of your theme or create a plugin. As a bonus I have turned this into a plugin too. Feel free to download, use, and modify our HTML 5 Search Form plugin. This plugin should be shortly is on the WordPress site.

The below code makes use of the new section element, search input type and placeholder attribute.

[cc lang=”PHP”]function my_search_form( $form ) {
$form = ‘

return $form;

add_filter( ‘get_search_form’, ‘my_search_form’ );[/cc]

To create it as a plugin by adding the following to the top of the PHP.

[cc lang=”PHP”]
Plugin Name: HTML 5 Search Form
Plugin URI: hhttp://createmy.com.au/quick-tip-changing-the-wordpress-search-form-to-html5/
Description: This plugin will change your WordPress search form to a HTML 5 search form.
Version: 1.0
Author: Dale Hurley
Author URI: http://createmy.com.au
License: http://www.gnu.org/licenses/old-licenses/gpl-2.0.html

Remember if you do turn it into a plugin, do NOT close the PHP tag.


  1. Pingback: Writting a WordPress Plugin | Create My - Dale Hurley - Web Developer and Designer

  2. Pingback: Facebook Social Graph WordPress Integration | Create My - Dale Mitchell Hurley - Web Developer and Designer

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s