Bello - Directory & Listing WordPress Theme

Google Map API Key

*Google has, starting July 16, 2018, made certain API and billing changes. In order to enable billing, you will need to provide credit card or billing account to Google Maps platform. Please note that we are in no way associated with Google Maps and their payment system and for any questions and issues regarding payments and billing you will need to contact them. Please refer to their FAQ and their documentation to learn more about these changes.

In order to be able to fully use all Bello theme's Google Map features, you will need to get an API Key, and then enable four different API services on Google Cloud.

First, please get your API key.

Then proceed to add the API key to Bold Builder Google Maps element.


Or Listing Map panel in Customizer.


And _listing_root category.


Once you have your API key, you need to enable following four services:

1. Places API - enable this API to use autocomplete search by locations in the search shortcode or main listing search - https://developers.google.com/places/web-service/intro.

2. Geocoding API - to convert the position by longitude and latitude and calculate distance from the visitor and listing location. This is the process of converting addresses (like "1600 Amphitheatre Parkway, Mountain View, CA") into geographic coordinates (like latitude 37.423021 and longitude -122.083739), which you can use to place markers on a map, or position the map - https://developers.google.com/maps/documentation/geocoding/start.

3. Maps Javascript API - To fully utilize google maps search, customization, etc. It lets you customize maps with your own content and imagery for display on web pages and mobile devices. The Maps JavaScript API features four basic map types (roadmap, satellite, hybrid, and terrain) which you can modify using layers and styles, controls and events, and various services and libraries - https://developers.google.com/maps/documentation/javascript/examples/.

4. Directions API - It's a service that calculates directions between locations - https://developers.google.com/maps/documentation/directions/start.