Phone numbers and email addresses turn blue on an iPhone: how to change the colour

On an iPhone, Safari spots phone numbers in your text and turns them into blue links on its own, even though you didn't link them in EverWeb. That's why they look right on your computer and blue on your phone. The best fix is to make the number a phone link yourself, in your own colours. If you'd rather the iPhone left numbers alone, add one line of code to your website.

Email addresses are different: they're usually blue only when they're already a link. A link's colour comes from your link settings, or from the Visited colour once you've clicked it. See When I changed my link colors, they don't appear changed when publishing.

Fix 1: make the number a link, in your own colours (recommended)

A number people can tap to call is handy on a phone, so keep it tappable and choose its colour.

  1. Double-click the text box and highlight the phone number.
  2. Go to Inspector > Hyperlinks and tick Enable as Hyperlink.
  3. Set Link To to An External Page and type tel: followed by the number with the country code and no spaces, for example tel:+14165550100.
  4. Under Hyperlink Formatting, set the colours. To match the text around it, pick the same colour as the text. In EverWeb 4.6 and later you can choose a Link Style there instead, so every link on your website looks the same.
  5. Publish and check on your iPhone.

Safari leaves numbers you've linked yourself in the colours you chose.

For an email address, do the same with Link To set to An Email Message, then set its colours under Hyperlink Formatting.

In EverWeb 4.6 and later: Insert > Button > Phone Call adds a ready-made call button. Type your number with the country code when asked.

Fix 2: stop the iPhone turning numbers into links

  1. Go to File > Edit Publishing Settings and scroll to Head/Footer Code.
  2. Paste this line into Head Code:
<meta name="format-detection" content="telephone=no">
  1. Choose File > Publish Entire Site, so every page gets the line.
  2. On your iPhone, close the page's tab and open your website again.
  • Only one page: select the page and paste the line into Inspector > Page Settings > Head/Footer Code instead.
  • Street addresses or dates turn blue too: use this line instead:
<meta name="format-detection" content="telephone=no, address=no, date=no, email=no">

After this, numbers you haven't linked are plain text, and visitors can't tap them to call. You can use both fixes together: the line stops Safari adding its own links, and the numbers you link yourself still work, in your colours.

Still blue?

  • Your iPhone is showing a saved copy. Open the website in a private tab. See How to clear your browser cache in Chrome, Safari, Edge and Firefox.
  • It's the Visited colour. Links you've already tapped use the Visited colour. Set it to match, or test on another device.
  • The number is inside a widget or outside code, such as a form or a booking calendar. Its colour comes from that widget's settings or the other company's code. Fix 2 still stops Safari's own links there.

Related articles

  • 0 Benutzer fanden dies hilfreich
War diese Antwort hilfreich?

Verwandte Artikel

Meine Website sieht auf dem Handy falsch aus: So funktioniert die mobile Darstellung in EverWeb

Wie Sie das beheben, hängt davon ab, welche Art von Seite Sie erstellt haben. EverWeb kennt zwei...

Muss ich meine EverWeb-Website für Mobilgeräte neu gestalten?

Nein. Ihre EverWeb-Website funktioniert so, wie sie ist, auf Handys und Tablets. Wie gut sie auf...

Meine Website sieht auf meinem Computer gut aus, ist aber auf meinem Handy abgeschnitten oder durcheinander

Meistens sind ein oder mehrere Objekte auf der Seite breiter als ein Handybildschirm, wodurch die...

Mit Containern eine responsive Seite erstellen, die sich auf dem Smartphone sauber stapelt

Eine responsive Seite ist eine einzige Seite, die sich so umordnet, dass sie auf jeden Bildschirm...

Objekte auf Handys, Tablets oder Computern aus- oder einblenden (Show on Device)

Sie können ein Objekt bei manchen Bildschirmgrößen anzeigen und bei anderen ausblenden. Wählen...