Main Content

Search Form

We use the default HTML5 form that comes with WordPress with a few modifications. Below is the form we use in our Web Standards theme. There is a filter applied to the search form HTML in order to edit or replace it. We use the get_search_form to replace it. This filter can be overwritten in your child theme. For more instructions please read the WordPress documentation for this filter.


if( !function_exists( 'tcu_wpsearch' ) ) {
	function tcu_wpsearch( $form ) {

		$form = '<form role="search" method="get" class="tcu-searchform cf" action="' . home_url( '/' ) . '" >
				 <label class="screen-reader-text tcu-visuallyhidden tcu-searchform__label" for="s">' . __( 'Search for:', 'tcu_web_standards' ) . '</label>
				 <input class="tcu-searchform__text" type="search" value="' . get_search_query() . '" name="s" id="s" placeholder="' . esc_attr__( 'Search the Site...', 'tcu_web_standards' ) . '" />
				 <input title="Search" class="tcu-searchform__submit" type="image" src="'.get_template_directory_uri().'/library/images/svg/search-icon.svg" alt="Search" />
				 </form>';

		return $form;
	}
}