Blog - Page 9 of 9 - GeoDirectory

Update Sept 2019

This has been added as a predefined custom field in V 2.0.0.67. The snippet below will only work if using GeoDirectory V1.

The Problem

Today a member had a bit of an unusual request, they are using GeoDirectory to run a local festival and they are listing things like accommodation for it. The request was to show the distance in each listing to the main event so users have a clear understanding of how far it will be to the event from each listing. I do something very similar on one of my own sites that is for one location, i list the distance to the airport and the distance to the main town, i have until now just had users enter this distance manually, this is often wrong and i have to correct it.

The Solution

This seemed like the perfect time to create a new custom field, lets call it “Distance to”. The code is below but there are two ways to use this field:
#1 We could just add the field and let the user enter GPS coordinates, it might be for example a “closest airport” field, the user could then enter the GPS info for the closest airport to them.
#2 In this users case he just needs to show the distance to one place and without the user really needing to even know about the field, so when he is adding the custom field he would set the field as a “admin only” field so it is not shown to the user on the frontend and they can’t change it, and then set the “default value” to the GPS coordinates needed and all listings will then show the info needed.

The Code

This post will tell you how to fix the “This page didn’t load Google Maps correctly. See the JavaScript console for technical details.” problem with Google Maps.

If you are using GeoDirectory please see our documentation here.

If you want to read about the problem see our blog post here: https://wpgeodirectory.com/google-maps-api-key-and-new-limits/

If you have seen the message “This page didn’t load Google Maps correctly. See the JavaScript console for technical details.” or any of the following messages:
“Esta página no ha cargado Google Maps correctamente.”
“Google Maps ne s’est pas chargé correctement sur cette page.”
“Google Maps non è stata caricata correttamente.”
“Google Maps wurde auf dieser Seite nicht richtig geladen.”
“При загрузке Google Карт на этой странице возникла проблема.”

The chances are you need this fix, if you are using WordPress then we have created a plugin that should fix this for most users who’s plugin or theme is causing this, you can find it here: GOOGLE MAPS API KEY FIX

If you are not using WordPress you will need to find your call to google maps in your source code and add the api key, you can find instruction on creating an API Key here. Once you have your API key you add it to your call to the Google maps file maps.google.com/maps/api/js?key=YOUR-API-KEY-HERE

I hope you found this useful, feedback is always welcome.

The GeoDirectory Team.

We are delighted to announce support for Snazzy Maps in our Custom Google Maps addon (1.0.5).

What is Snazzy Maps?

Snazzy Maps is an online resource that enables users to customize the colors, saturation, and other styling options of their Google Maps.

The customization options are provided in the form of different map styles designed by various authors across the web.

In addition to editing maps with Snazzy Maps, users can create their Snazzy Map styles for use within their websites or apps.

All customized maps also offer high-resolution satellite imagery and vector support for both web and mobile devices.

With these features, businesses and developers alike can create visually appealing maps for their projects without relying on coding skills.

Why did we add support for Snazzy Maps on GeoDirectory?

Just over a week ago, one of our Members `Pieter Ravelli` brought the website to our attention, and it struck a chord with the team here, so it was pushed to the top of our development tasks.

This defines our ethos here at GeoDirectory. If a member can suggest something that will benefit all members, we will happily add it.

Importing Snazzy Maps Styles into GeoDirectory

Adding snazzy maps to the Geodirectory Custom Maps add-on is relatively simple.

First, go to snazzymaps.com and find or create a style you like.
Once you are on the page you like, you will see a copy button. Click that.
Next, go to your GeoDirectory settings and go to GD>Custom Google Maps>Manage Styles and click to edit the map you want to change.
On the edit map styles screen, click the “import styles” button, paste your styles code from Snazzy Maps, and click the “Import & Save Styles” button.
Now your new map styles will be used on your site.