Replace ClassiPress Location Search field with a custom field dropdown

A detailed instruction on how to replace Location Search field with a custom field dropdown on your WordPress ClassiPress site.

The default ClassiPress search bar has three fields:

1. Search keywords
2. Location
3. Categories

The ClassiPress Location field needs to refine search results to some geographic location. It can use the Google Places API for a location autocomplete and radius search or it may take a simple string to compare against ads address fields.

The following mod replaces default location field with a States dropdown list and allows restricting search results to a specific state.

This method can be applied for any field of the drop-down or checkbox type, such as Country, Region, Size, Color, etc.

The mod should be made in the template file searchform-listing.php, so using a child theme is the preferable way to implement the change.

1. Create file searchform-listing.php in the root folder of the child theme.
2. Add the following code in this file:

<?php
/**
 * The listing search form template file
 *
 * @package ClassiPress
 * @since 4.0.0
 */

if ( ! isset( $search_form_location ) ) {
	$search_form_location = 'bar';
}
$is_widget       = 'widget' === $search_form_location;
$location_search = false;
$states_field_token = '';

$form_fields = $wpdb->get_results( "SELECT * FROM $wpdb->cp_ad_fields ORDER BY field_id asc" );
$states_field = wp_list_filter( $form_fields, array( 'field_name' => 'cp_state' ) );

if ( ! empty( $states_field ) ) {
	$location_search = true;
	$states_field    = array_shift( $states_field );
	$select_options  = cp_explode( ',', $states_field->field_values );
	$select_options  = array_filter( $select_options );
	$html_options = '';
	$html_options .= html( 'option', array( 'value' => '' ), __( 'All States', APP_TD ) );
	$cp_state = '';
	if ( ! empty( $_GET['cp_state'] ) && is_array( $_GET['cp_state'] ) ) {
		$cp_state = $_GET['cp_state'];
		$cp_state = array_shift( $cp_state );
	}
	foreach ( $select_options as $option ) {
		$args = array( 'value' => $option );
		if ( ( $option === $cp_state ) || ( esc_attr( $option ) === $cp_state ) ) {
			$args['selected'] = 'selected';
		}
		$html_options .= html( 'option', $args, $option );
	}
	$args  = array( 'name' => $states_field->field_name . '[]', 'id' => $states_field->field_name );
	$states_field_token =  html( 'select', $args, $html_options );
}
?>
<script type="text/javascript">
	jQuery( function( $ ) {
		$('.search-form').submit( function () {
			$( this )
				.find('.search-state-wrap select')
				.filter( function () {
					return !this.value;
				} )
				.prop( 'name', '' );
		});
	} );
</script>
<form method="get" class="search-form" action="<?php echo esc_url( get_post_type_archive_link( APP_POST_TYPE ) ); ?>" role="search">
	<div class="row">
		<div class="search-keywords-wrap medium-<?php echo $is_widget ? 12 : ( $location_search ? 4 : 5 ); ?> columns">
			<input name="s" type="search" id="search_keywords" class="search_keywords" value="<?php the_search_query(); ?>" placeholder="<?php echo esc_attr_x( 'What are you looking for?', 'placeholder text', APP_TD ); ?>" />
		</div>
		<?php if ( $location_search ) { ?>
			<div class="search-state-wrap medium-<?php echo $is_widget ? 12 : 3; ?> columns">
				<?php echo $states_field_token; ?>
			</div><!-- .search-state-wrap -->
		<?php } ?>
		<div class="search-category-wrap medium-<?php echo $is_widget ? 12 : ( $location_search ? 3 : 5 ); ?> columns">
			<?php wp_dropdown_categories( cp_get_dropdown_categories_search_args( $search_form_location ) ); ?>
		</div>
		<div class="search-button-wrap medium-<?php echo $is_widget ? 12 : 2 ?> columns">
			<button type="submit" class="button expanded">
				<i class="fa fa-search" aria-hidden="true"></i>
				<?php esc_html_e( 'Search', APP_TD ); ?>
			</button>
		</div>
		<?php
		/**
		 * Fires after the main header search fields.
		 *
		 * @since 4.0.0
		 */
		do_action( 'cp_listing_header_search_fields_after' );
		?>
		<input type="hidden" name="lat" value="<?php echo ! empty( $_GET[ 'lat' ] ) ? esc_attr( $_GET[ 'lat' ] ) : 0; ?>">
		<input type="hidden" name="lng" value="<?php echo ! empty( $_GET[ 'lng' ] ) ? esc_attr( $_GET[ 'lng' ] ) : 0; ?>">
		<input type="hidden" name="st" value="<?php echo esc_attr( APP_POST_TYPE ); ?>">
		<input type="hidden" name="refine_search" value="yes">
	</div> <!-- .row -->
</form>

In result, the search form will look like this:

As it was mentioned above, you can use any other drop-down field instead of “States”.

For that, find a field meta name in the ClassiPress field editor:

In example, we have the field “Country” with meta name “cp_country“.

Replace all entries of cp_state with cp_country in the code snippet above to make location search by Countries instead of States.