My map is not showing

If your map is not displaying on the front-end of your website, this could be due to a number of reasons. Please follow the steps in order to troubleshoot the problem:

Step 1: Flush/Empty/Delete your Cache

Ensure that you have flushed your cache if you are using a caching plugin.

 

Step 2: Check your theme’s footer.php file

Some custom theme’s forget to install a very important standard WordPress hook called “wp_footer();” which many plugins make use of.

Ensure that your theme’s footer.php file has this hook in it by completing the following steps:

  • Log into the admin section of your WordPress site
  • Locate the Appearance link in the left navigation panel and click on “Editor”
  • Locate the “footer.php” file in the list on the right side of the page and click on it
  • Ensure that “wp_footer();” is called just before the closing </body> tag. See the image below for an example:

wp_footer

  • Save the footer.php file and refresh your front-end page that contains the map’s short code. If your map is still not showing, please continue with this help file.

Step 3: Check if jQuery is installed

If jQuery is not installed in your theme, you should be seeing the following message in the console which you can bring up using ctrl +shift+J:

console error: “Uncaught ReferenceError: jQuery is not defined”

If this is the case, please see this page.

If you are seeing a blank page where your map is supposed to be, please proceed with this help file.

Step 4: Are you trying to display the map in Tabs or Accordions?

If you are trying to display the map in a tab or an accordion, you’ll need to modify the code to suit this (We have tried to put a universal check in for this but depending on your theme or plugin, this may not work as it should).

Please open wp-google-maps-pro/js/core.js and search for the following piece of code:

jQuery('body').on('tabsactivate', function(event, ui) {
for(var entry in wpgmaps_localize) {
InitMap(wpgmaps_localize[entry]['id'],'all',false);
}
});

Directly below that, add the following:

jQuery('body').on('click', '.the_class_name_of_your_tab_or_accordion', function(event, ui) {
for(var entry in wpgmaps_localize) {
InitMap(wpgmaps_localize[entry]['id'],'all',false);
}
});

Replace the .the_class_name_of_your_tab_or_accordion with the relevant class name of the element.

Step 5: Identify if your website is producing any JavaScript errors

Use this WordPress tutorial to help identify JavaScript errors on your website’s front-end. See http://codex.wordpress.org/Using_Your_Browser_to_Diagnose_JavaScript_Errors#Chrome

If there are in fact javaScript errors on your page, this could cause WP Google Maps to not function correctly. By reading the JavaScript error, you may be able to determine which plugin is causing the error. Your option thereafter could be to disable that particular pluin or make use of another similar plugin instead that doesn’t product any errors.

Although we have tried our best to develop WP Google Maps in a way that still works if other plugins are causing errors, sometimes this still isnt good enough. The only option is to find an alternative plugin to the one causing issues or contact the developer of that plugin in the hopes of them fixing the issue.

 

If you are still experiencing problems or need more help, please contact us directly and we’ll get the problem sorted out as soon as possible!