Built-in google map zoomed out / not centered and doesn't work at all

I have included a google map in a page on my wordpress website by switching WYSIWYG from "visual" to "text" and copy and paste the iframe code directly from google.

The map should look like this, and this is the preview I get on Google Maps:

enter image description here

But instead, the output after saving the page is like this:

enter image description here

The size of the iframe is fine, but obviously scaling is the way to go. I tried to adjust the zoom manually by adding the iframe src attribute with & z = 16 or & zoom = 16 (suggested here https://productforums.google.com/forum/#!topic/maps/kcjwmB5XFx8 ) but it doesn't matter ... I also tried to embed the map in HTML directly rather than via WYSIWYG, but again it doesn't matter.

Here is the iframe I'm using (straight from google with & zoom = 16 appended:

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2378.829376418671!2d-2.177285999999947!3d53.399992000000005!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x487bb3692bfd0239%3A0xa83c755a7500764!2sThe+Wycliffe+Hotel+Ltd!5e0!3m2!1sen!2suk!4v1413989769351&zoom=16" width="891" height="501" frameborder="0" style="border:0"></iframe>

      

The iframe doesn't apply CSS, it doesn't work at all. I know people were having trouble nesting in the latest version of Google Maps, so I also tried to go back to classic Google Maps and use the old embed code, I can get the zoom to work using the following code, but I can't focus the map on the marker ( the marker is in the upper-left corner).

<iframe width="891" height="501" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.co.uk/maps?sll=53.399992,-2.177286&amp;sspn=0.0049128,0.0109864&amp;cid=757668333021562724&amp;q=The+Wycliffe+Hotel+Ltd&amp;ie=UTF8&amp;hq=&amp;hnear=&amp;t=m&amp;ll=53.399992,-2.177286&amp;spn=0.006295,0.006295&amp;output=embed&z=16"></iframe>

      

enter image description here

When did card nesting become so difficult? And when did you need to add your own attributes to get the rendering? I have seen so many problems like this since the new Google Maps were introduced.

+3


source to share


1 answer


<embed> instead of iframe works </embed>



0


source







All Articles