IOS – Phone numbers different color on iOS wordpress

coloriosWordpress

We have a newly created website, with lots of contact information for different employees. The color of the phone numbers in the website are all in black, except for when viewed on an iOS device,

When viewed on an iOS device the color for each contact number is gray, does anybody know how to correct this? And perhaps why this occurs?

Best Answer

Have a look at phone-numbers-changing-to-unwanted-gray-color-on-iphone-and-ipad post.

It is possible that you have the same issue where you link color is what is determining the iOS color and you may need to setup a Browser Specific CSS plugin according to the post

Update: 9th Nov 2014

I found another post update-banning-blue-links-on-ios-devices which effected a change for a test phone link on my wordpress site.

Although the numbers where a light blue because they are being data detected.

This solution may or may not help you figure your issue.

In the post they offer various ways of achieving a change with various results.

Their favourite is the option 5.

Which is surrounding the number in a custom span class.

Declare you css classes as normal in your head:

.appleLinksWhite a {color: #ffffff !important; text-decoration: underline;} 
.appleLinksBlack a {color: #000000 !important; text-decoration: none;}
.appleLinksRed a {color: #FF0000 !important; text-decoration: none;}

and the surround the number in the chosen class

contact:<span class="appleLinksRed"> 0205 992 9921</span>
Related Question