Map is located in tab which is hidden by default

For correct working of map that is located in the tab, which is hidden by default – you should do some simple actions:

  1. Add the ID of map as an attribute to tab header.
  2. Add a small script with a callback for click on your tab headers – directly on a page with tabs or into any javascript file of your theme which is loaded on the page with tabs. The callback should:
    • get the map id from tab header
    • get map object using the function gmpGetMapById(map_id) (it is a global function of Google Maps Easy plugin)
    • call the function refresh() of map object to refresh map after show tab content.

It can be done as in the example below. Let’s imagine that we have a tabs container with id “tabsList” and a several tabs, which have tab header with class “tabItem”. We can write next callback for click on tabs header:

If you do not understand clearly – what exactly should happen in js code – please show this article to your site developer.

Latest Articles
Get plugins bundle today and save over 80%