X Features Cars Demo Power Plants Demo State Parks Demo Site Showcase Docs Tutorials Add-ons Buy

Proximity

Overview

The proximity facet lets you find results near a specified location.

facet-proximity

IMPORTANT: For “locate me” to work, your site needs to be HTTPS-enabled. Learn more »

How it Works

After entering a location, FacetWP uses Google to grab the latitude, longitude of that location’s central point. Results within a user-defined radius of that point are displayed.

It does not understand geographic / political boundaries. If you search for a country (e.g. Italy), the facet will return results extending from that country’s center, which may include results from other countries.

Accuracy of the “Locate me” button

When the “Locate me” button is pressed, FacetWP attempts to determine the user’s location. FacetWP first makes a browser Geolocation API request, which returns an approximate latitude/longitude (based on the user’s IP address).

Then FacetWP performs a reverse lookup to determine the human-friendly physical address. This not an exact science, and occasionally the location can be off by several kilometers.

Usage

The Data Source should be a custom field containing a comma-separated latitude, longitude.

Listify / Listable users: set the facet’s Data Source to geolocation_lat.

If your posts are not geocoded, try the Advanced Custom Fields plugin. Add a Google Map field to attach a location to your posts. To support multiple locations per post, wrap your Google Map field within a Repeater.

Alternatively, you could use the Address Geocoder plugin. If you go this route, then choose martygeocoderlatlng for the data source.

Available Options

Name Description
Other data source Choose a longitude field if stored separately from the latitude
Unit of measurement Miles or kilometers
Radius UI The UI for the radius selector (dropdown, slider, none)

Using a Google Maps API Key

The proximity facet requires a valid Google Maps API key. After generating an API key, add it to Settings > FacetWP > Settings.

Limit Autocomplete to a Specific Country

Force the autocomplete to show only choices in Germany (country code = “de”).

add_filter( 'facetwp_proximity_autocomplete_options', function( $options ) {
    $options['componentRestrictions'] = array(
        'country' => 'de',
    );
    return $options;
});

Limit Autocomplete to Showing Cities

add_filter( 'facetwp_proximity_autocomplete_options', function( $options ) {
    $options['types'] = ['(cities)'];
    return $options;
});

Change the Minimum Character Length and Delay

add_filter( 'facetwp_assets', function( $assets ) {
    FWP()->display->json['proximity']['queryDelay'] = 250; // default = 250 milliseconds
    FWP()->display->json['proximity']['minLength'] = 3; // default = 3 characters
    return $assets;
} );

See Also

Proximity facet: show post distance

Facet Configuration

Presentation