**SOLVED** Phone number displays as link on iPhone

onlye · Post by **onlye** » Fri Oct 30, 2020 8:00 pm

My customer is testing a new site with a focus on mobile. He sent an screen shot of the footer with the phone numbers in blue. The design is white text on blue background. Looks like his iphone X is displaying the phone numbers as links. So the link formatting (blue text) fades into the blue background. I need to address this but preferred not to change the site color theme.

I tested the site on my Android with Firefox and Chrome and also on my wife's iPhone 12. It looks as designed on my test.

Has anyone else seen this and is my option to reverse the colors of the footer to White background and blue text?

THANKS!

BaconFries · Post by **BaconFries** » Fri Oct 30, 2020 8:14 pm

This is due to you not defining the number correctly as a telephone number (link). To fix highlight the number in question go to Link->Link->Link to: Select as Phone Number

MGD4me · Post by **MGD4me** » Fri Oct 30, 2020 8:29 pm

I believe this an Apple 'feature'. It is called Smart Links. It will also do this with an email address. The idea is that a user can then simply 'click' on the underlined blue link, and place a phone call, or send an email, without having to write down the information by hand.

Handy... yes. Distracting... also yes.

A workaround would be to convert the text to an image, then it will display correctly. Or, try BaconFries suggestion, which I have not tried yet.

onlye · Post by **onlye** » Fri Oct 30, 2020 8:34 pm

I created a new link style to make all the renditions of the link White Text with the Blue Background. It keeps the phone number white on the iPhone. But it does throw me off that the phone number now display as blue in WWB design.

onlye · Post by **onlye** » Fri Oct 30, 2020 8:35 pm

MGD4me wrote: ↑Fri Oct 30, 2020 8:29 pm I believe this an Apple 'feature'. It is called Smart Links. It will also do this with an email address. The idea is that a user can then simply 'click' on the underlined blue link, and place a phone call, or send an email, without having to write down the information by hand.

Handy... yes. Distracting... also yes.

A workaround would be to convert the text to an image, then it will display correctly. Or, try BaconFries suggestion, which I have not tried yet.

Bad Apple.
You should see my apple account password. Not an apple fan.

onlye · Post by **onlye** » Fri Oct 30, 2020 8:37 pm

BaconFries wrote: ↑Fri Oct 30, 2020 8:14 pm This is due to you not defining the number correctly as a telephone number (link). To fix highlight the number in question go to Link->Link->Link to: Select as Phone Number

Thanks I did that when I created the link style. I was frustrated that Apple just made the plain text a link.

BaconFries · Post by **BaconFries** » Fri Oct 30, 2020 8:46 pm

So previous suggestions don't work? Ok try this Page Properties and inserting into Meta Tags>Meta Tags>User Define" inserting the following

Code: Select all

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

you can also try this insert using Page HTML between<head></head> tags*

Code: Select all

<style>
a[href^=tel] {
   text-decoration:inherit;
   color: inherit;
}
</style>

crispy68 · Post by **crispy68** » Fri Oct 30, 2020 8:58 pm

Bacon's suggestion of:

Code: Select all

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

should fix the issue.

onlye · Post by **onlye** » Fri Oct 30, 2020 9:03 pm

BaconFries wrote: ↑Fri Oct 30, 2020 8:46 pm So previous suggestions don't work?

Sorry. Yes it is good now. But thanks for those code snippets!

Originally the phone numbers where text with no link or format to be a clickable phone number. I did what you said and made them tel: links. I also created a new link style to keep the text color white and the background blue. So all good. I appreciate your replies.

www.wysiwygwebbuilder.com

SOLVED Phone number displays as link on iPhone

SOLVED Phone number displays as link on iPhone

Re: Phone number displays as link on iPhone

Re: Phone number displays as link on iPhone

Re: Phone number displays as link on iPhone

Re: Phone number displays as link on iPhone

Re: Phone number displays as link on iPhone

Re: Phone number displays as link on iPhone

Re: Phone number displays as link on iPhone

Re: Phone number displays as link on iPhone