Embed google map from shared url - google-maps

If I have an string url like https://goo.gl/maps/h3maMVM6JHJ2
How can I get the url https://www.google.com/maps/place/Wal+Mart/#1.0124826,102.7074445,17z/data=!3m1!4b1!4m5!3m4!1s0x31d6da283960bf79:0xff2a6dc939314ae0!8m2!3d1.0124826!4d102.7096332
using javascript

click on the link: https://goo.gl/maps/h3maMVM6JHJ2
resolves to:
https://www.google.com/maps/place/Wal+Mart/#1.0124826,102.7074445,17z/data=!3m1!4b1!4m5!3m4!1s0x31d6da283960bf79:0xff2a6dc939314ae0!8m2!3d1.0124826!4d102.7096332
click on the share icon:
click on "Embed Map":
click on "COPY HTML"
You will get an <iframe> with the src= attribute you need:
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3989.1953868324035!2d102.70744451475375!3d1.0124825992614412!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x31d6da283960bf79%3A0xff2a6dc939314ae0!2sWal+Mart!5e0!3m2!1sen!2sus!4v1545288648700" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3989.1953868324035!2d102.70744451475375!3d1.0124825992614412!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x31d6da283960bf79%3A0xff2a6dc939314ae0!2sWal+Mart!5e0!3m2!1sen!2sus!4v1545288648700" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

Related

Why is my video not being displayed?

My code:
<iframe height="420" width="315" src="https://www.youtube.com/watch?v=ddR9g-
YzE8g" frameborder="0" allowfullscreen></iframe>
Problem is, video is not being displayed as shown in the codepen
The codepen: https://codepen.io/don0ts/pen/gjYJvq
He you should use "/embed" along with the youtube link. A correct way of doing this should be :
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1">
</iframe>
Check the dev tools (usually with F12)
It shows this:
Refused to display 'https://www.youtube.com/watch?v=ddR9g-YzE8g' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
See: link
<iframe width="560" height="315" src="https://www.youtube.com/embed/ddR9g-YzE8g" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
You should actually write this:
<iframe frameborder="0" height="190" src="https://www.youtube.com/embed/ddR9gYzE8g" width="100%"></iframe>

How to code this html on wordpress

Need some help to code this i add a sample shot of the error, i have tried to add the frame and it doesn't work for me.
<iframe allowfullscreen="" frameborder="0"height="300"src="http://publicidad.dicom.gob.do/banners/medios/blogs/espaciodeprensa/index.html" width="700" scrolling="no"></iframe>
error show
You got no spaces between your attributes. Try this:
<iframe allowfullscreen="" frameborder="0" height="300" src="http://publicidad.dicom.gob.do/banners/medios/blogs/espaciodeprensa/index.html" width="700" scrolling="no"></iframe>
Use to text widget than to paste iframe code in text widget.

How to enable autoplay on Instagram embedded video?

I have a simple html page. I dont want to use javascript or call Instagram API.
I would like to enable AutoPlay and Loop on Instagram video like we have with youtube:
<iframe width="400" height="300" src="https://www.youtube.com/embed/[ID]?loop=1&controls=0&autoplay=1" frameborder="0"></iframe>
Following the Instagram Help instructions:
https://help.instagram.com/513918941996087
And for Instagram:
<iframe width="400" height="300" src="https://www.instagram.com/p/[ID]/embed/" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
But I dont find a way to enable Autoplay and loop. Do you have an Idea?
When ready call:
$('body > div > div.Content.EmbedFrame > div > div > div.fXIG0').click()

iframe doesn't embed, just pops up with open with/save as box. Tried everything

All I want to do is embed this banner, I have tried every possible combination and googled as much as I can. Here are my current live attempts.
Non wordpress - http://mch.co.uk/centrallondon/iframetest.shtml
With this code:
<iframe
src="http://www.mch.co.uk/centrallondon/immac.html"
width="445"
height="85"
scrolling="no"
frameborder="0" ></iframe>
Wordpress - http://mch.co.uk/centrallondon/iframe-test.shtml
With this code:
[iframe
width="640"
height="480"
src="http://www.mch.co.uk/centrallondon/immac.html"]
<iframe
src="http://www.mch.co.uk/centrallondon/immac.html"
width="445"
height="85"
frameborder="0"
scrolling="no">
</iframe>
The wordpress one includes a shortcode from an iframe embedding plugin.

How to remove bubble from Google Map

I've done some searching and it seems that you need to remove the iwloc part of the path, but I can't find it anywhere!
<iframe width="725" height="300" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=ightham&aq=&sll=51.223215,0.33516&sspn=0.048003,0.132093&gl=uk&ie=UTF8&hq=&hnear=Ightham,+Kent,+United+Kingdom&t=m&z=14&ll=51.287109,0.286445&output=embed"></iframe>
I think &iwloc=near at the end is what you need. This example also shows that you really just need the postcode and the magnification i.e z=10
<iframe width="400" scrolling="no" height="300" frameborder="0" src="https://maps.google.co.uk/maps?hl=en&q=so21+1aj&z=10&output=embed&iwloc=near" marginwidth="0" marginheight="0"></iframe>
Check this live example
Remove the:
&q=ightham
That removes the bubble for me:
https://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&aq=&sll=51.223215,0.33516&sspn=0.048003,0.132093&gl=uk&ie=UTF8&hq=&hnear=Ightham,+Kent,+United+Kingdom&t=m&z=14&ll=51.287109,0.286445&output=embed