MyListing Location Radius Field
The {CODICTS} MyListing Location Radius Field plugin adds a new custom field type to the MyListing theme that allows listing owners to specify a radius around each location. Unlike MyListing’s default Location field, this field combines an address picker with a radius slider — ideal for delivery areas, service zones, coverage maps, or any business that operates within a defined geographic circle.
Important limitation: The Location Radius field and the default MyListing Location field cannot be used on the same listing type form simultaneously due to maps script conflicts. Use one or the other per listing type.
Installation & Activation
Start by downloading the plugin from the Downloads page on your dashboard on the CoDicts website.
After downloading, install and activate the plugin in WordPress by navigating to “Plugins” > “Add New” > “Upload Plugin” and selecting the downloaded zip file. Click “Install Now” and then “Activate”.
On activation, the plugin automatically creates a custom database table for location data and copies template files into your child theme. Navigate to any Listing Type → Fields tab to start adding the Location Radius field.
Key Features
| Feature | Description |
|---|---|
| Location + Radius Field | A repeater-based field where listing owners enter an address and set a radius using an interactive slider — with live circle preview on the map. |
| Multiple Locations | Supports multiple location entries per listing (configurable limit), each with its own address and radius. |
| Map Content Block | Displays an interactive map on the single listing page with markers and coloured circle overlays showing each location’s coverage area. |
| Explore Page Filter | A proximity toggle on the Explore page that returns only listings whose radius circle encompasses the searched location (e.g., “Delivers to my location”). |
| Km or Miles | Configurable radius units — metric (kilometres) or imperial (miles). |
| Google Maps & Mapbox | Works with whichever map provider is configured in MyListing — both are fully supported. |
| Optimised Database | Uses a dedicated database table with indexed lat/lng columns for fast proximity queries. |
| Dynamic Tags | Use location data in preview cards and quick info via MyListing’s dynamic tag system. |
How It Works
The plugin provides three components that work together to create a complete location-radius experience:
| Component | Where It Appears | What It Does |
|---|---|---|
| Custom Field | Add/Edit Listing form | Listing owners enter addresses and set a radius using a map + slider. |
| Content Block | Single listing page | Displays an interactive map with markers and coloured circle overlays for each location. |
| Explore Filter | Explore/search page | Visitors toggle a filter to find only listings whose radius covers the searched location. |
Use Cases
| Use Case | How It Works |
|---|---|
| Delivery areas | Restaurants or shops set their delivery radius. Customers search an address and toggle “Delivers to Location” to find businesses that deliver to them. |
| Service zones | Contractors, cleaners, or plumbers define their service area. Homeowners search their address to find professionals who cover their location. |
| Coverage maps | Any business operating within a geographic circle can visually display their coverage area on their listing page. |
Setting Up the Location Radius Field
The field controls what listing owners see when they create or edit a listing.
1. Edit a listing type in the MyListing admin.
2. Navigate to the Fields tab.
3. Add a new field and select “{C} Location Radius” from the field type list.
4. Configure the field settings:
| Setting | Default | Description |
|---|---|---|
| Label | {C} Location Radius | The label displayed above the field on the add/edit listing form. |
| Key | location-radius | Unique field key used for data storage. |
| Max Locations | 3 | Maximum number of location entries a listing owner can add (repeater limit). |
| Map Skin | Default | Visual style for the map. Options depend on your MyListing map configuration. |
| Map Default Location (Lat/Lng) | 0 / 0 | The map center when no location has been entered yet. |
| Map Zoom | 12 | Default zoom level (0–22). |
| Radius Text | Delivery Radius: | The label shown next to the radius slider (e.g., “Service Area:” or “Coverage Radius:”). |
| Radius Units | Metric (Km) | Kilometres or Miles. Must match the setting on the Explore filter. |
| Radius Step | 1 | Step increment for the radius slider (e.g., 1 = whole numbers, 0.5 = half increments). |
| Radius Max | 50 | Maximum radius value the slider allows. |
| Radius Default | 2 | The default radius value when a new location entry is added. |
| Required | No | Whether at least one location entry is mandatory. |
5. Save the listing type.
What Listing Owners See
On the add/edit listing form, listing owners interact with a repeater where each entry includes:
Address input — with map provider autocomplete, a “My Location” geolocation button, and optional manual latitude/longitude entry.
Interactive map — clicking the map moves the pin and reverse-geocodes the address. The pin can be locked to prevent accidental moves.
Radius slider — a draggable slider that updates the radius value in real-time, draws a red circle on the map showing the coverage area, and auto-zooms to fit the circle.
Listing owners can add multiple location entries up to the configured maximum by clicking “Add Location.”
Setting Up the Content Block
The content block controls how the location radius map appears on the single listing page.
1. Edit the same listing type.
2. Navigate to the Single Page (or Profile) tab.
3. Add a new content block and select “{C} Location Radius”.
4. Configure the block settings:
| Setting | Default | Description |
|---|---|---|
| Title | {C} Location Radius | Section heading displayed above the map (e.g., “Our Delivery Area”). |
| Source Field | job_location | Select the Location Radius field that provides the location data. |
| Map Skin | skin1 | Visual style for the map. |
| Map Zoom | 11 | Default zoom level. The map auto-zooms to fit the radius circles. |
5. Save the listing type.
What Visitors See
On the single listing page, visitors see an interactive map displaying each location as a marker with a red circle overlay showing the coverage radius. Below the map, each location’s full address is listed with the radius value and units (e.g., “Delivery Radius: 5 Km”) and a “Get Directions” link. The listing’s logo or thumbnail is used as the marker icon.
Setting Up the Explore Filter
The filter allows visitors on the Explore page to find only listings whose radius covers a specific location.
1. Edit the same listing type.
2. Navigate to the Search Forms (Explore) tab.
3. Add a new filter and select “{C} Location Radius”.
4. Configure the filter settings:
| Setting | Default | Description |
|---|---|---|
| Label | {C} Location Radius | Filter heading on the Explore page. |
| Units | Metric (Km) | Must match the units setting on the field. Kilometres or Miles. |
| Unfiltered Label | All | Text for the “show all listings” option. |
| Filtered Label | Delivers to Location | Text for the “enable radius filter” option (e.g., “Services my area,” “Covers my location”). |
| Hide Filter | Off | When enabled, the filter is hidden from the UI but still applies if set to “Enabled by Default.” |
| Enabled by Default | Off | When enabled, the radius filter is automatically active on page load. |
5. Save the listing type.
How the Filter Works
1. A visitor enters a search location on the Explore page (e.g., their home address).
2. The Location Radius filter appears (it’s only visible when a search location is entered).
3. The visitor toggles from “All” to “Delivers to Location” (or your custom label).
4. The plugin runs a proximity query that calculates the distance between the searched location and each listing’s stored locations. It returns only listings where the searched location falls within the listing’s defined radius.
5. For example, if a restaurant set a 10 km delivery radius and the visitor’s address is 8 km away, the restaurant appears in results. If another restaurant’s radius is only 5 km, it doesn’t.
Note: The filter is only visible to logged-in users and only when a search location has been entered. It uses the Haversine formula for accurate great-circle distance calculations.
Dynamic Tags
You can use the Location Radius field data in MyListing’s dynamic tag system for preview cards, quick info, and other template areas:
| Tag | Output | Example |
|---|---|---|
[[location-radius.address]] | Full address (first location) | 123 Main St, City, Country |
[[location-radius.short]] | Short address (first part before comma) | 123 Main St |
[[location-radius.lat]] | Latitude (first location) | 40.71280 |
[[location-radius.lng]] | Longitude (first location) | -74.00600 |
[[location-radius.radius]] | Radius value (first location) | 5 |
[[location-radius.list]] | HTML list of all addresses | <p>123 Main St</p> <p>456 Oak Ave</p> |
Note: Replace
location-radiuswith your actual field key if you changed it from the default.
Example Setup — Delivery Radius
1. Activate the plugin with the MyListing theme and a child theme active.
2. Edit a listing type (e.g., “Restaurants”).
3. On the Fields tab, remove the default “Location” field (the two cannot coexist on the same listing type). Add a “{C} Location Radius” field and configure it:
a. Set the Label to “Delivery Area.”
b. Set Max Locations to 1 (restaurants typically have one location).
c. Set Radius Text to “Delivery Radius:”.
d. Set Radius Units to Metric (Km).
e. Set Radius Max to 30 and Radius Default to 5.
4. On the Single Page tab, add a “{C} Location Radius” content block. Set the Title to “Delivery Area” and the Source Field to your Location Radius field.
5. On the Search Forms tab, add a “{C} Location Radius” filter. Set the Filtered Label to “Delivers to my location” and ensure Units matches the field (Metric).
6. Save the listing type.
7. A restaurant owner creates a listing, enters their address, and uses the radius slider to set a 10 km delivery radius. The map shows a red circle around the restaurant’s location in real-time.
8. On the Explore page, a customer searches their home address. They toggle “Delivers to my location.” Only restaurants whose delivery radius covers the customer’s address appear in the results.
9. On the restaurant’s listing page, visitors see an interactive map with the restaurant’s marker and a red circle overlay showing the 10 km delivery area, plus the address, radius, and a “Get Directions” link below.
Example Setup — Multi-Location Service Zone
1. Follow the same steps above for a listing type like “Home Services” or “Contractors.”
2. Set Max Locations to 3, allowing service providers to define multiple coverage areas (e.g., offices in different cities).
3. Set Radius Text to “Service Area:” and Radius Max to 100.
4. Set the Explore filter’s Filtered Label to “Services my area.”
5. A plumber creates a listing with two locations — their main office (25 km radius) and a satellite location (15 km radius). Both appear on the listing page map with separate red circle overlays.
6. When a homeowner searches the Explore page and toggles “Services my area,” the plumber appears if their address falls within either of the two radius circles.
Frequently Asked Questions
Does this require a child theme?
Yes. The plugin copies multiple template files into the child theme for the field, content block, and explore filter. Without a child theme, the plugin cannot install its templates.
Can I use this alongside the default MyListing Location field?
Not on the same listing type. Due to maps script conflicts, the Location Radius field and the default Location field cannot coexist on the same listing type form. Use one or the other per listing type. Different listing types can use different field types.
Does it work with both Google Maps and Mapbox?
Yes. The plugin automatically detects which map provider is configured in MyListing and renders accordingly. Both Google Maps and Mapbox are fully supported for the field, content block, and circle overlays.
What units are supported?
Metric (kilometres) and imperial (miles). The units setting on the field and the Explore filter must match for accurate results.
Can listing owners add multiple locations?
Yes. The field uses a repeater that allows multiple location entries, each with its own address and radius. The maximum number is configurable in the field settings (default is 3).
How does the Explore filter work?
When a visitor enters a search location and toggles the filter, the plugin calculates the distance between the search location and each listing’s stored locations using the Haversine formula. It returns only listings where the search location falls within the listing’s defined radius circle.
Why is the Explore filter only visible sometimes?
The filter only appears when a search location has been entered (it needs coordinates to calculate proximity). It’s also only visible to logged-in users.
Can I use location data in preview cards?
Yes. The plugin supports MyListing’s dynamic tag system. Use tags like [[location-radius.address]] for the full address, [[location-radius.short]] for a shortened version, or [[location-radius.radius]] for the radius value.
What does the red circle on the map represent?
The red circle overlay on the single listing page’s map visually shows the coverage radius around each location. The circle is drawn proportionally to the actual radius value — a 10 km radius produces a circle with a 10 km geographical radius on the map.
Does the plugin create a database table?
Yes. The plugin creates a custom table (wp_codicts_location_radius) to store location data with indexed latitude and longitude columns for fast proximity queries. The table is created automatically on activation.
What happens when the plugin is deactivated?
The template files are removed from the child theme and the field, block, and filter will no longer appear. The custom database table and its data are preserved. Reactivating the plugin restores full functionality with existing data intact.
Troubleshooting
Field Not Appearing in Listing Type Editor
| Cause | Solution |
|---|---|
| Templates not installed | Deactivate and reactivate the plugin to force-reinstall templates. Verify template files exist in your child theme’s templates/ directory. |
| Plugin not activated | Go to Plugins → Installed Plugins and verify the plugin is active. |
| MyListing or child theme not active | Both the MyListing theme and a child theme must be active. Check Appearance → Themes. |
Map Not Showing on the Add Listing Form
| Cause | Solution |
|---|---|
| Conflict with default Location field | The Location Radius field and the default Location field cannot be on the same listing type form. Remove one of them. |
| Map API not configured | Ensure your Google Maps API key or Mapbox token is properly configured in the MyListing theme settings. |
| JavaScript error | Check the browser console (F12 → Console) for errors. Other plugins may be causing conflicts. |
Radius Circle Not Showing on Single Listing Page
| Cause | Solution |
|---|---|
| Content block not added | You need both the field (for data entry) and the content block (for display). Add a “{C} Location Radius” content block to the listing type’s Single Page tab. |
| Wrong source field selected | Ensure the content block’s “Source Field” is set to your Location Radius field. |
| No location data | The listing must have at least one location entry saved. Edit the listing and add a location. |
Explore Filter Not Appearing
| Cause | Solution |
|---|---|
| No search location entered | The filter only appears when a visitor enters a search location with coordinates. It’s hidden otherwise. |
| User not logged in | The filter is only visible to logged-in users. |
| Filter not added | Add a “{C} Location Radius” filter in the listing type’s Search Forms tab. |
Filter Returns No Results or Wrong Results
| Cause | Solution |
|---|---|
| Units mismatch | The units on the field and the Explore filter must match. If the field is set to Metric (Km), the filter must also be set to Metric (Km). |
| Radius too small | If listings have very small radius values, they may not cover the searched location. Check the radius settings and listing data. |
| No location data saved | Listings must have location data saved in the Location Radius field. Listings using the default Location field won’t be included in radius filter results. |
Listings Not Showing on Explore Page Map
| Cause | Solution |
|---|---|
| Preview card fallback | The plugin includes a modified preview card template that falls back to the Location Radius field when the default Location field has no data. If the Explore map still doesn’t show markers, ensure the listing type doesn’t have a conflicting preview card template. |
Template Overwrite Warning
The following template files in your child theme are managed by this plugin and may be overwritten on reactivation:
templates/add-listing/form-fields/location-radius-field.php
templates/admin/listing-types/filters/location-radius-filter-options.php
templates/explore/filters/location-radius.php
templates/single-listing/content-blocks/location-radius-block.php
partials/listing-preview.phpIf you’ve customized these files, back up your changes before deactivating/reactivating the plugin.
“MyListing Theme Not Detected” or “Child Theme Not Detected” Error
The MyListing theme and a child theme must both be installed and active. Go to Appearance → Themes to verify.
For further support, visit codicts.com or contact us at support@codicts.com.