[llgruff]

Мне нужно на странице контактов (dogshow.me/contact) разместить 2 карты Google с метками, для чего я воспользовался шорткодами jQuery UI Tabs. Поддержка шорткодов уже была интегрирована в тему Wordpress.

Код:

[tabgroup set="adress" titles="Зал на Парке Победы, Зал на Пионерской"]
[tab set="adress" position="1"]
<strong>Санкт-Петербург. Станция метро Парк Победы. Улица Бассейная, дом 55 (вход со двора)</strong>
[hr style=double-line margin_top=35 margin_bottom=0]
[googlemap width="880" height="350" src="https://maps.google.ru/maps/ms?hl=ru&amp;gl=ru&amp;ie=UTF8&amp;oe=UTF8&amp;msa=0&amp;msid=215905446834965766922.0004f74f17355880ca38a&amp;t=m&amp;ll=59.866883,30.331407&amp;spn=0.00754,0.037766&amp;z=15&amp;iwloc=0004f74f3e2f9a9378872&amp;output=embed"]
[/googlemap][/tab]
[tab set="adress" position="2"]
<strong>Санкт-Петербург. Cтанция метро Пионерская. Коломяжский проспект, дом 28 (вход со двора)</strong>
[hr style=double-line margin_top=35 margin_bottom=0]
[googlemap width="880" height="350" src="https://maps.google.ru/maps/ms?hl=ru&amp;gl=ru&amp;ie=UTF8&amp;oe=UTF8&amp;msa=0&amp;msid=215905446834965766922.0004f74f17355880ca38a&amp;t=m&amp;ll=60.012974,30.298662&amp;spn=0.015014,0.075531&amp;z=14&amp;iwloc=0004f74f1aaeb4a1ba9d5&amp;output=embed"]
[/googlemap][/tab][/tabgroup]

Я столкнулся с проблемой — при открытии скрытой вкладки, на которой 2-ая карта — смещен центр карты далеко влево, хотя он прописан через координаты latitude и longitude. Если обратиться непосредственно к этой вкладке (dogshow.me/contact#tabs-adress-2), то отображение производится нормально и карта центрирована.

Через поисковики и по форумам я нашел некоторые решения этой проблемы. Наиболее часто предлагается решение (slyweb.ru/jquerydoc/tabs-options.php) (stackoverflow.com/questions/1428178/problems-with-google-maps-api-v3-jquery-ui-tabs) :

.ui-tabs .ui-tabs-hide {
    position: absolute !important;
    left: -10000px !important;
    display:block !important;
}

Также предлагается внесение изменений в javascript (stackoverflow.com/questions/6465239/google-maps-not-centering-because-div-is-displaynone-on-page-load):

<script type="text/javascript"> 
$(function() {
    $("#map_link").click(function(event) {  
        event.preventDefault();
        $("#map").slideToggle(); 
        $("#map").html('google_map_iframe_here').css('display','block');
        });  
});
</script>

К сожалению, моих знаний недостаточно, чтобы решить эту проблему, а эксперименты основанные на советах с форумов результатов не дали. Возможно кто-нибудь сможет помочь с написание или редактированием исходного кода применительно к блогу? (dogshow.me/contact)