Looking for solution to define an address as a default map app link

On iOS, when visiting some web pages, an actual address or a postal location, e.g. 10 Downing Street, London, SW1A 2AA, will act as a link to open the iOS default Map App. This doesn’t always happen with a valid address, so I am wondering if there is an additional step required to tag or mark the address as a postal address and link to the Map App if clicked on.

Does anyone know how to achieve this.

Note. This is different to opening a link to Google Maps. Links to Google Maps don’t work unless the page visitor is logged into Google.

Working on Apple map Place, i.e. specifying coordinates?
example:

https://maps.apple.com/place?q=Via%20Graziella%20Campagna%207&ll=38.207931%2C15.241108&address=Via%20Graziella%20Campagna%207%2C%2098057%20Milazzo%20ME%2C%20Italia

copy the link and open it with safari

Thanks.

However, that is a direct link to https://maps.apple.com which won’t work well for non Apple users.

I am looking for a method to open the default Map App set by the page visitor, whatever it is - i.e. Apple Map or Google Maps.

https://www.google.it/maps/place/Polli+alla+brace+Golosità+di+Lipari+Daniela/@38.2079123,15.2405631,19z/data=!4m5!3m4!1s0x131431b89daca46f:0x28c83c7617171582!8m2!3d38.2080542!4d15.2410779

I usually do this.

1 Like

Thanks again, but direct links to Google or Apple maps are not what I am looking for.

I think the solution is along the lines of using

<address class="some class" itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress"><meta itemprop="addressCountry" content="United Kingdom">POSTCODE, <span itemprop="addressLocality">TOWN</span>, ADDRESS</address>

Which is then detected on iOS or Android as a map location and opened by the default Map App.

I will do more digging.

1 Like

ok, anyway even having IOS, someone would like to open the link on Google Map.
I think putting the 2 options is better as a choice.
otherwise on apple devices it could always open Apple Map to you and vice versa.

IMHO the danger with a link to Google Maps is that if the page visitor is not logged into Google, or not prepared or able to sign into Google, or register with Google and then sign in, they may give up on this critical stage, and then go elsewhere.

Having a system to detect and use your choice of Map App, and there are many more Map Apps than just Apple and Google, will be a 1 click route into your choice of Map App, and AFAIK the best solution.

1 Like

👍

Why not incapsulate the address in the address tag?

<address>
1 Television Centre 
101 Wood Lane
W12 7FA London
</address>

Good idea, but doesn’t work unfortunately.

Could you use the two link method as suggested by Gianluca but use Joe’s Agent stack to display the appropriate link depending on which OS the user has?

1 Like
1 Like

Thanks. I have seen a simpler solution that uses the location postal address to do this without any script.

The method from memory, just had a sort of tag along the same lines as tel: for phone numbers.

I very cleverly saved this method somewhere, and then very stupidly forgot where I saved it.

Yes, I saw from the above that you were looking for an attribute on an HTML element but I thought it had been nearly a week and the simple JS solution is rock solid and just works.

3 Likes

Appreciate it. It’s that frustrtrating thing where you know there is potentially a very simple solution out there.

Luckily I’m not in a hurry to solve this one but it has been on my “must sort this out list” for a while.

Even Googling the topic is a challenge because of the double meaning of the search terms.

Have you tried a geo location on a link?

<a href="geo:51.481310,-3.180500" target="_blank">Open Map</a>

EDIT: No - doesn’t work

1 Like

JW has a Directions stack that seems to do what you want.

I vaguely recall that the solution is something along the lines of:

<ahref="address:10 Downing Street, London, SW1A 2AA">10 Downing Street, London, SW1A 2AA</a>

1 Like

Do you mean the GEO URI?

You’d need to know the longitude and latitude of the object and incapsulate it as follows:

<a href="geo:51.878022795954344,5.853966330203495">netStek</a>
2 Likes