Header Map doesn’t work

Updated: August 18, 2016

The common issue in directory type themes like CityGuide, Directory+, EventGuide, FoodGuide, BusinessFinder+ (and others similar) is broken Header Map. Instead of the map with pins you see only grey section:

broken-header-map

Possible reasons are:

  • Missing Header Map element address
  • Wrong Item GPS coordinates

Header Map address

Edit the page where map doesn’t appear in Page Builder and expand settings for Header Map element. You will see settings for Address. On the image you can see correct options for Address. Address field include some real address that can be found by Google Maps API as a default position and both Latitude and Longitude fields include float number separated by “.” dot. Do not use any other separators like comma or semicolon: “,” “;”

header-map-missing-address

Item GPS coordinates

The most frequent issue is that some of items have wrong GPS coordinates (even one Item post with wrong coordinates will break the map as Google Maps API cannot recognize position). Same as above, the GPS coordinates must be in valid floating number format with ONLY floating number with dot “.” used as decimal separator.

Here are few examples of wrong formats:

  • 40,713695
  • 40;713695
  • 40.713.695

The simple way how to find out if this is reason of your problem, is to open Developer Console in your browser and search for javascript errors:

item-wrong-gps

Author: Ivan Hudak

Support Manager