how do I display phone numbers on my web page so that iphones do not see it as a link?

On my web page the phone number displays ok on a pc and on some mobile phones like Samsung.
On some iphones it displays as a pale blue link.
How do I make my web page so that it shows the phone number in the font and size I decide.
Thank you.
Who is Participating?
John EastonConnect With a Mentor DirectorCommented:
I take it all your pages are static HTML and not a programming front end (e.g. PHP) with a database backend?

You should be able to find software to do find and replace on an entire directory.  E.g. replacing the closing title tag with the closing title tag, plus the new meta tag.  However, if doing this make sure you have a backup of the folder as you would not be able to 'undo' if you got anything wrong!

Notepad++ I think can do this, but if you use FrontPage or similar to edit your site it may also be able to do it.
John EastonDirectorCommented:
The Blue links are useful for iPhone users at it allows the to click the link to make a call.  However, if you don't like then there are a couple of options (although I have not tried them).

One option is to add a meta tag in your head section. e.g:
   <title>iOS blue links test</title>
   <meta content="telephone=no" name="format-detection">

Open in new window

Or you can wrap your links in a styled span. e.g.:
<span class=”appleLinksBlack”>0123 456 789</span>

Open in new window

And add the following to your CSS:
.appleLinksBlack a {color: #000000 !important; text-decoration: none;}

Open in new window

More detail is available from which I where I learned of these options.
MalcolmBishopAuthor Commented:
The problem with some of the iphones I looked at is the blue link is very pale.
I use a pale blue background on my webpage and you could not see the link at all as it was almost the same colour.
This must have been happening for several years on my webpage and nobody has mentioned it as I test the webpage on my Samsung which always displays exactly the same as a pc.
I am puzzled whether every webpage in the world has to do this just to satisfy Apple users.
I have not noticed it in the source code of other pages.
I will try your option 1.
It is not possible for me to view the new change as I do not have an iPhone here.
I will do the change and contact iPhone users tonight. I think that is the only way I can test it.
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

MalcolmBishopAuthor Commented:
Just read the article you pointed me at and I am still confused about web pages.
I am puzzled whether every webpage in the world has to do this just to satisfy Apple users.
 I have not noticed it in the source code of other pages.
John EastonDirectorCommented:
I can't say I've looked into other pages source code.  However, as an iPhone / iPad user most sites I visit have the blue highlighting.  On my own sites most (if not all) have had the number on a white background so I have not need to implement the changes.

However, it is not just Apple users.  Website often display differently in different browsers.  I recall Skype (I think) once had a browser plugin that highlighted numbers and clicking them initiated a call through Skype.  And who knows if Android or Windows phones have a similar features (I have not used either).

Therefore as web designers there are often things outside our control which can affect how the finished website looks to end users.  Some we just have to accept (like the different screen sizes), others we can take some steps to address like your example above.
MalcolmBishopAuthor Commented:
Have added the code in your option 1 above.
By pure coincidence a customer with an iPhone has just arrived.
The phone number ( which is on 3 different lines on the page) now displays exactly as I built it.
Although that is a result I have several hundred pages of cars.
I am presuming I will have to upload that code to every single page. It will take me weeks.
Appreciate your solution, but would like to keep question open for a few days in case another solution pops up.
MalcolmBishopAuthor Commented:
Thank you for the solution.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.