Member Avatar for Motorider

I just finished a site that list three zip codes as a service area.
when the site is viewed in smart phone browsers the three zip codes become linked to Google maps or it tries to offer the zip as a call now phone feature. when the wrong zip is clicked the mapping service is unable to locate the map.

Can anyone help me please resolve this.

Thanks

  • 1 Contributor
  • 1 Reply
  • 106 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by Motorider

Dani AI

Generated

Mobile browsers use "data detectors" that turn digit-like text into actionable links (phone, maps, etc.). is on the right track with disabling automatic detection for phones, but there are safer ways to keep click-to-call while stopping zip codes from being misinterpreted — and a couple of simple, testable alternatives.

One reliable pattern: disable automatic detection site-wide, then add explicit telephone anchors for every phone number so click-to-call still works. Explicit tel: anchors are the standard and supported broadly; format numbers in international (E.164) form where possible. Example:

<a href="tel:+14155552671">+1 (415) 555-2671</a>

If the problem is wrong map lookups, the most robust approach is to make zip codes explicit links to a mapping query so the browser opens the correct place instead of guessing. Using Google Maps URL parameters avoids the browser’s heuristics and gives predictable results:

<a href="https://www.google.com/maps/search/?api=1&query=90210" target="_blank" rel="noopener">90210</a>

A lightweight, local fix is to break the digit sequence so detectors won’t trigger (use a zero‑width space). This preserves the visual text but prevents automatic linking; note it can interfere with copy/paste and may affect screen readers:

<span>123&#8203;45</span>

For iOS-mail/webview cases some people use the x-apple-data-detectors="false" attribute to suppress detection, but support varies by context — don’t rely on it alone for production behavior.

Recommended workflow: decide if global disable + explicit tel: anchors or explicit map links for zips fits the site; implement one approach; then test on iOS (Safari), Android (Chrome) and any specific device/browser your users use. For tel: anchors see MDN and for Maps URLs see Google’s URL docs: MDN tel links and Google Maps URLs.

Member Avatar for Motorider

Seems to be a tough one. The only solution I can find is;

<meta name="format-detection" content="telephone=no" />

Still would like the phone number link to work. Will leave the thread open for a few more days.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.