How To Enable Category Specific Search On Category Archives In Genesis

Category Specific Search in Genesis

WordPress search form helps the users to search for the content on the website. Genesis extends the WordPress search form to add features like accessibility and other customization that enhances the user’s search experience.

There are times and use cases when genesis search filter comes in handy to modify the behavior of default search form. For instances, one of my clients recently wanted to use category specific search box on the archives page; so that the site users get the ability to search category specific articles. Here’s the tutorial for the same.

Add the following code to your functions.php to enable the category specific search on the category archives. This will help the site users to search within the context when they’re viewing a category listings (archive) page.

Tweaking the Genesis search form

To enable the category specific search, you need to use the genesis_search_form filter and include category search parameters in the search form for category archive pages.

add_filter( 'genesis_search_form', 'bt_search_in_category_form', 10, 4 );
function bt_search_in_category_form( $form, $text, $button, $label ) {
	if( !is_category() ) // Bail if not on category archives
		return $form;
	
	// Fetch the slug for currently displayed category
	$current_cat_id = get_query_var( 'cat' );
	$current_cat_obj = get_category( $current_cat_id );
	$current_cat_name = $current_cat_obj->slug;
	
	// Since, we're rebuilding the Genesis form, we'll keep the filters intact
	$text = get_search_query() ? apply_filters( 'the_search_query', get_search_query() ) : apply_filters( 'genesis_search_text', __( 'Search this website', 'genesis' ) . ' …' );

	$button = apply_filters( 'genesis_search_button_text', esc_attr__( 'Search', 'genesis' ) );
	
	$label = apply_filters( 'genesis_search_form_label', '' );	
	$value_or_placeholder = ( get_search_query() == '' ) ? 'placeholder' : 'value';
	
	// Default behaviour for form inputs
	$onfocus = "if ('" . esc_js( $text ) . "' === this.value) {this.value = '';}";
	$onblur  = "if ('' === this.value) {this.value = '" . esc_js( $text ) . "';}";
	
	
	/* Inheriting the exact Genesis code for search form; separately build for themes that support html5 and keep the accessibility feature intact */
	
	if ( genesis_html5() ) {
	
		$form  = sprintf( '<form %s>', genesis_attr( 'search-form' ) );

		if ( genesis_a11y( 'search-form' ) ) {
			if ( '' == $label )  {
				$label = apply_filters( 'genesis_search_text', __( 'Search this website', 'genesis' ) );
			}

			$form_id = uniqid( 'searchform-' );

			// Just adding an extra hidden field with current category as value
			$form .= sprintf(
				'<meta itemprop="target" content="%s"/><label class="search-form-label screen-reader-text" for="%s">%s</label><input itemprop="query-input" type="search" name="s" id="%s" %s="%s" /><input type="hidden" name="category_name" id="category_name" value="'. $current_cat_name .'" /><input type="submit" value="%s" /></form>',
				home_url( '/?s={s}' ),
				esc_attr( $form_id ),
				esc_html( $label ),
				esc_attr( $form_id ),
				$value_or_placeholder,
				esc_attr( $text ),
				esc_attr( $button )
			);
		} else {
			// Just adding an extra hidden field with current category as value
			$form .= sprintf(
				'%s<meta itemprop="target" content="%s"/><input itemprop="query-input" type="search" name="s" %s="%s" /><input type="hidden" name="category_name" id="category_name" value="'. $current_cat_name .'" /><input type="submit" value="%s"  /></form>',
				esc_html( $label ),
				home_url( '/?s={s}' ),
				$value_or_placeholder,
				esc_attr( $text ),
				esc_attr( $button )
			);
		}

	} else {
		// Just adding an extra hidden field with current category as value
		$form = sprintf(
			'<form method="get" class="searchform search-form" action="%s" role="search" >%s<input type="text" value="%s" name="s" class="s search-input" onfocus="%s" onblur="%s" /><input type="hidden" name="category_name" id="category_name" value="'. $current_cat_name .'" /><input type="submit" class="searchsubmit search-submit" value="%s" /></form>',
			home_url( '/' ),
			esc_html( $label ),
			esc_attr( $text ),
			esc_attr( $onfocus ),
			esc_attr( $onblur ),
			esc_attr( $button )
		);
	}
	
	return $form;
}

Once you’ve added this code to your functions.php, the search results page will show the results from specific category only. Ain’t that cool!

How will your visitors know that you are using category specific search on your website?

After configuring the search form to perform category-specific search on category archives, consider changing the default placeholder text for the search forms on category archives pages. This will act as an indicator for the site visitors.

Add the following code to your functions.php to change the default placeholder text for search form:

add_filter( 'genesis_search_text', 'bt_cat_searchform_text', 20 );
function bt_cat_searchform_text() {
	if( is_category() ) { // Should only run on category archives
		return __( 'Search this Category' ); // Modify the text that appears as placeholder
	}
}

Do not edit your theme’s core files directly. If your theme does not offer a separate functions.php to tweak the site functionality, you use WP Designer plugin which allows you to add custom functionality and CSS to your theme.

Posted In:

UX UI Front-end Development, Code Snippets, Genesis WordPress Theme Framework Child-Theme

Comment on How To Enable Category Specific Search On Category Archives In Genesis

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