How to display search form, category sorting filter and radius filter

Before displaying the search Form, category sorting filter, and Radius filter first you need to display listings below the map. Previously we have seen tutorial Display listings below the map. Refer to How to Display listings below the map.

In this tutorial, we will use a search form, category sorting filter, and Radius filter.

Search Form

Search Form is used to search any location and display it on a map.

Step 1 Enable the Display Search Form option in the Listing Settings section as below.

then you’ll see the search field below the map on the front end.

Step 2 Enter a search location into the search box. Search results will appear automatically in listing the location’s Filters as you type.

Category Sorting Filter

Sort locations by title, category name, or address, alphabetically, in both ascending and descending order.

Step 1 In the Listing Settings section enable the Display Category Filter option and also enable the Display Sorting Filter tab.

Step 2 Move to the browser and select any category and sorting filter from the listing. You’ll see a location display according to your category sorting. (See image)

Radius Filter

Mapping for single points on a map and filtering within a specific mile radius.

Step 1 Enable the Display Radius Filter option in the Listing Settings section.

Dimension: Dimension is the unit of distance, you can choose kilometers, or miles. The calculator will immediately calculate with the selected distance unit.
Radius Options: You can use this tool to find the radius around a point on the map.

Step 2 You can create as many radius using the comma(,). Then you’ll see the radius dropdown below the map on the front end.

Miscellaneous Options

You can display sorting, switch between grid & list view, and print listing options as well. If you tick all of them, it will give you an all-in-one solution.

then you’ll see awesome locations listing, with filters, below the map on the front end.

Related Tutorials:

• How to display listings below the Google Maps
• How to use a listing placeholder in listing settings
• How to print listing
• How to do URL filter in maps plugin
• How to display locations per page in listings

Related Examples:

• Stores Locator Example
• Kairav Listing Skins
• Advanced search on markers listing in Google Maps
• Universities Listing
• A complete listing solution for Google Maps