Title: Map only loads when resizing screen
Last modified: August 21, 2016

---

# Map only loads when resizing screen

 *  [Glennbosch](https://wordpress.org/support/users/glennbosch/)
 * (@glennbosch)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/)
 * I am trying to display a map (short code) within a (custom) tab on my woocommerce
   product webpage. The issue is that the map does not load properly. I checked 
   with different browsers but all have the same behaviour.
 * However when I resize the webpage the maps loads perfectly. Could this be a JavaScript
   issue?
 * I realy need to display my map with the product
 * Any sugestions
    Thanks Glenn
 * [http://wordpress.org/plugins/leaflet-maps-marker/](http://wordpress.org/plugins/leaflet-maps-marker/)

Viewing 7 replies - 1 through 7 (of 7 total)

 *  Plugin Author [Robert Seyfriedsberger](https://wordpress.org/support/users/harmr/)
 * (@harmr)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/#post-4253071)
 * can you provide an url please so that I can have a look?
 *  Thread Starter [Glennbosch](https://wordpress.org/support/users/glennbosch/)
 * (@glennbosch)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/#post-4253167)
 * Hi Robert,
 * hetrwith the [link](http://www.nebbiolowijn.nl/winkel/product/tramin-lagrein-doc/)
   please select the tab “Wijnproducent”
 * Within this tab I use the shortcode
 * Thanks Glenn
 *  Plugin Author [Robert Seyfriedsberger](https://wordpress.org/support/users/harmr/)
 * (@harmr)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/#post-4253171)
 * Hi Glenn,
    I had the same issue with sites using jquery ui tabs, for which I 
   could add a workaround in my plugin. Can you please tell me which plugin you 
   are using for tabs here? “WooCommerce Custom Product Tabs Lite”, “TabsManager”
   or another plugin? I will check afterwards if I can add a workaround for this
   plugin too… best, Robert
 *  Thread Starter [Glennbosch](https://wordpress.org/support/users/glennbosch/)
 * (@glennbosch)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/#post-4253180)
 * Hi Robert,
 * Great, the plugin is:
    WooCommerce Custom Product Tabs Lite version 1.2.4 | by
   SkyVerge
 * Good luck
    Glenn
 *  Thread Starter [Glennbosch](https://wordpress.org/support/users/glennbosch/)
 * (@glennbosch)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/#post-4253181)
 * Hi Robert fyi,
 * A response from the theme developer:
    ——————————————- Hey!
 * Actually it seems to be a problem with the WooCommerce tab script which does 
   not trigger a map resize. You can reproduce the issue with any responsive theme(
   i.e. the default TwentyThirteen theme) because Google maps won’t re-size correctly
   if percentage values are used for the map width. Abundance is not a responsive
   theme and thus the maps work properly. I created a ticket here: [https://github.com/woothemes/woocommerce/issues/4014](https://github.com/woothemes/woocommerce/issues/4014)
   and asked the WooCommerce devs to fix it. This is all I can do for now.
 * Regards,
 *  Plugin Author [Robert Seyfriedsberger](https://wordpress.org/support/users/harmr/)
 * (@harmr)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/#post-4253186)
 * Hi Glenn,
 * I am having troubles reproducing this issue on a test site of mine at [http://www.webtermine.at/testsystem/Produkt/test/](http://www.webtermine.at/testsystem/Produkt/test/)
 * I am not sure if a workaround is possible here – could I have temp admin acess
   to your site so that I can try out a fix? (send details via [http://mapsmarker.com/contact](http://mapsmarker.com/contact)).
 * If that is not possible, please try the following:
    – open /inc/showmap.php –
   find
 * `$('.ui-tabs').on('tabsactivate', function(event, ui) {`
 * and replace it with
 * `$('.ui-tabs, .tabs').on('tabsactivate', function(event, ui) {`
 * Then it should work.
 * best,
 * Robert
 *  Thread Starter [Glennbosch](https://wordpress.org/support/users/glennbosch/)
 * (@glennbosch)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/#post-4253192)
 * Hi Robert,
 * Yes, many thanks for the fix and very swift response. The map(s) loads beautifully
   in and outside the woocommerce tabs. I will inform Kriesi (the theme developer)
   and recommend your plugin.
 * Thanks again
    Glenn

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Map only loads when resizing screen’ is closed to new replies.

 * ![](https://ps.w.org/leaflet-maps-marker/assets/icon.svg?rev=970936)
 * [Leaflet Maps Marker (Google Maps, OpenStreetMap, Bing Maps)](https://wordpress.org/plugins/leaflet-maps-marker/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/leaflet-maps-marker/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/leaflet-maps-marker/)
 * [Active Topics](https://wordpress.org/support/plugin/leaflet-maps-marker/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/leaflet-maps-marker/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/leaflet-maps-marker/reviews/)

## Tags

 * [loading](https://wordpress.org/support/topic-tag/loading/)
 * [resizing](https://wordpress.org/support/topic-tag/resizing/)
 * [tab](https://wordpress.org/support/topic-tag/tab/)

 * 7 replies
 * 2 participants
 * Last reply from: [Glennbosch](https://wordpress.org/support/users/glennbosch/)
 * Last activity: [12 years, 7 months ago](https://wordpress.org/support/topic/map-only-loads-when-resizing-screen/#post-4253192)
 * Status: not resolved