[cmadaoParticipant]

Hi,

I’m trying to embed a google map at the Header Widget, as shown in integrity 1 demo.

I’ve the <iframe> code from google maps, and the code that is on the Header 2 widget area is:

[map]<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3415.017601615931!2d-8.796166999999539!3d40.15508301240187!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xd2248611f2c7c3b%3A0x9338c302336502ec!2sberry.pt!5e1!3m2!1spt-PT!2spt!4v1412436408634" width="435" height="350" frameborder="0" style="border:0"></iframe>[/map]

But, when I open the header widget area, the map is always with “full zoom out”, like this:

I’ve tried to add the zoom parameter (e.g. &z=16″), but it does not change the zoom.

My site: www.berry.pt

Thanks,
Carlos

[RadModerator]

Hi there,

Thanks for posting in.

Map is dynamically generated based on it’s container size. If its container has no width or height, the map can’t calculate the proper zoom and position. Containers with no width or height are elements that were loaded hidden just like header widgets.

Add this code at your customizer’s custom javascript under Admin > Appearance.

jQuery(function($){ $('a.x-btn-widgetbar').click(function(){ 

var reloaded = $(this).data('map-reloaded');

if( reloaded !== true) {

var iframe = $( '.x-widgetbar-inner .x-map iframe' ).get(0);
iframe.src = iframe.src;

$(this).data('map-reloaded', true );

}

}); });

Cheers!

[cmadaoParticipant]

Thanks!! … Worked just fine 😉

[RubinKeymaster]

You’re welcome!

[Samuel LParticipant]

Hi,

I’m having the same problem. I’ve tried to find Admin > Appearance and I’m not able to find this location. I do see a place to enter custom javascript under Appearance > Customize > Custom.

However in that custom section, I have Google Analytics code in there. Once I do put the code that you mention above, there is no change to the Google map. I still have the same cut off and zoomed out look mentioned by cmadao.

I’m open to suggestions. Thanks.

[ZeshanMember]

Hi Samuel,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL as stated on the forum entrance page. This is to ensure that we can provide you with a tailored answer to your situation.

Thanks!

[Paolino NParticipant]

Hello,
My URL is http://www.radiofficine.it and I am having exactly the same issue as Samuel L. explained above.
Look forward to your kind feedback on this matter.
Thanks,
Paolino

[CousettMember]

Can you confirm that you are fully updated? (Theme and Plugins)

The latest version of X is 2.6.0 and the x-shortcodes plugin is 2.5.0. Please verify you have both of these versions, they need to be in sync or Javascript issues can occur.

You can find the latest version numbers here: (http://theme.co/x/member/changelog/) Then you can compare them to what’s installed on your site.

If you find anything to be out of date, you can review our update guide.

[Paolino NParticipant]

Hello,
I double checked and have this running:
– WordPress 4.0 running X – Child Theme: Integrity Light theme.
– X Version: 2.6.0 By Themeco
– X–Shortcodes Version 2.5.0 | By Themeco
Look forward to your kind reply.
Thanks,
Paolino

[Kosher KMember]

Hi There,

Upon checking on your Customizer Javascript,

I can see this code,

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-49877122-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

Please remove <script type="text/javascript"> and </script>

You should only add something like this

var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-49877122-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

Hope that clarifies,

Have a great day

[Paolino NParticipant]

Hello,
Thank you for your kind and prompt reply.
I have made the suggested changes accordingly but the issue on the Widget Map is still there.
Thanks for your kind attention.
Paolino

[Kosher KMember]

Hi There,

Upon checking on your site, you only fix the analytics code issue but you never added the javascript originally provided on this topic for fixing the map.

Please refer to this -> http://theme.co/x/member/forums/topic/google-map-problem-at-header-widget/#post-118610

Cheers

[Paolino NParticipant]

Hello,
as by you suggested I have added the code to fix the map issue on top and now everything seems to work fine!
Thank you very much for your kind assistance.
Ciao,
Paolino

[Nabeel AModerator]

Glad to hear this Paolino.

Have a nice day 🙂

[goodhewParticipant]

I am having the exact same issue, waiting for a response. Thank you.

[Author]

Posts