OpenStreetMap iframe won't work

Is there any reason why

<iframe width="100%" height="500" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://www.openstreetmap.org/export/embed.html?bbox=10.972546935081484%2C49.59850757245689%2C10.97988545894623%2C49.60164362863992&amp;layer=mapnik&amp;marker=49.600075625759565%2C10.976216197013855" style="border: 1px solid black"></iframe><br/><small><a href="http://www.openstreetmap.org/?mlat=49.60008&amp;mlon=10.97622#map=18/49.60008/10.97622">Größere Karte anzeigen</a></small>

won’t show up?

Hi and welcome to the Kirby forum. Could you please explain in what way your question is related to Kirby? Are you using this code in a Kirby Starterkit? If so, where?

Hi and thank you for your prompt answer.

Unlike Google iframes (calendar and map), an OpenStreetMap-

The same iframe does work perfectly, however, if I use it in a simple
html file, both locally and on our server.

Here’s the iframe:

Is its stubbornness related to Kirby or rather to OpenStreetMap?

[ In January 2016, as a bloody html&css let alone php or js beginner, I
compared Kirby to Joomla, Wordpress, Typo3, Drupal, Contao, Redaxo, and
what not. There’s nothing as manageable as Kirby for our needs. Daily
fun to work with.]

I can’t reproduce this, it certainly has nothing to do with Kirby nor with OSM, if I put that snippet into the home template of a Starterkit, everything’s fine:

1 Like

You ARE quick - and effective!

Helpful answer that’ll keep me prying and probing.

Thanks a lot!

Is your website online?

1 Like

Yes, it is:
https://www.asg-er.de/
At the bottom of
https://www.asg-er.de/kontakt
you only see a black frame where the rest of the OSM map is supposed to
show up.

Ah, it’s what I thought. Your site is https but the src attribute uses http. If you change the URL, it will work:

<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="//www.openstreetmap.org/export/embed.html?bbox=10.970685482025146%2C49.5968664515866%2C10.98160743713379%2C49.603138573344914&amp;layer=mapnik&amp;marker=49.60000261331038%2C10.976146459579468" style="border: 1px solid black"></iframe>

If you ever run into a problem like this again, check your dev console:

[blocked] The page at about:blank was not allowed to display insecure content from http://www.openstreetmap.org/export/embed.html?bbox=10.970685482025146%2C49.5968664515866%2C10.98160743713379%2C49.603138573344914&layer=mapnik&marker=49.60000261331038%2C10.976146459579468.

and use // instead of the protocol, when including content from other sites.

Wunderbar, es klappt!
DANKE!