[alinagraceParticipant]

Hello! All of the phone numbers on the iPhone automatically change into a link, but only on Safari. (on the Chrome browser it’s perfectly fine). All of the links on my website are currently set to be a dark grey color since white is the main background. However, on one of my site’s pages, I have white text on top of an darker image, so on the iPhone, the number doesn’t show up very well. I would like to change that number link to be a white font, but I don’t want to effect all of the other number links on the website. (Example: the phone number in the footer would disappear if I made them all white).

Right now,
I have this code in place: (which effectively changes the color of the number but then changes all other numbers)

a[href^=”tel”] {
color: #f3f3f3;
}

Here are some screenshots. And I’ll give you my login info in a private reply just in case.

[alinagraceParticipant]

This reply has been marked as private.

[ehsdParticipant]

Not Themeco, but here’s a few suggestions:

• if using CornerStone, you could set copy your CSS to the custom CSS area for the problem page.
• if not using Cornerstone you can also create a custom CSS class in either a child theme stylesheet or in the customizer custom CSS area.
• or you could also add your code as in-line styles. Though if there are a lot of links or pages this can get to be a hassle to update or change

[Rue NelModerator]

Hello There,

Thanks for writing in! You can still use the code you are using. Simply update it so that you will have a specific code for the phone number in your footer. You can make use of this code:

/* All phone number turns to white color */
a[href^="tel"] {
  color: #f3f3f3;
}

/* Phone number in the footer turns to gray color */

footer a[href^="tel"] {
  color: #7a7a7a;
}

We would loved to know if this has work for you. Thank you.

@ehsd:
Thanks for chiming! We really appreciate it.

[alinagraceParticipant]

This worked! Thank you so much for your help!

And thank you @ehsd for your response as well 🙂

[RupokMember]

You are welcome!

Glad that it helped. Feel free to let us know if you face any other issue. We’ll be happy to assist you.

Thanks for using X.

Cheers!

[Author]

Posts