How to stop a hyperlink from turning blue in email editor | Community
Skip to main content
October 6, 2015
Solved

How to stop a hyperlink from turning blue in email editor

  • October 6, 2015
  • 2 replies
  • 21185 views

Hi,

I've created an email and I want the text to remain in a white colour but whenever I highlight the words and turn them into a hyper link, the formatting changes and the text colour changes to blue but I want it to remain white.

I've tried editing the HTML but haven't had any luck yet.

Any ideas?

Cheers,

Chris

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Joe_Reitz

if you need the text it to stay white, try using an !important declaration to override any other styling. Text-decoration will keep it from being underlined, but color is a different property. And remember, most email clients like Gmail, Yahoo, etc. prefer seeing in-line CSS... It's painstaking, but it will help ensure your emails look the same across a variety of clients.

For example, for the Learn More text inside this 100% CSS button we use looks like this:

<a style="text-decoration: none; color: #ffffff !important; font-size: 18px; font-family: Arial, Helvetica, sans-serif;" href="info.stanleycss.com/2015PerimeterSecurity.html">LEARN MORE</a>

2 replies

Andy_Varshneya1
Level 7
October 6, 2015

Hi,

That is happening because of text-decorations. If you want to modify just a single link, you can do it by adding the styling to the HTML for the link like so:

<A HREF="page.html" STYLE="text-decoration: none">Huh</a>

Otherwise if it's a global change, you'll need to update the css style, as shown here CSS text-decoration property

Andy

Joe_Reitz
Joe_ReitzAccepted solution
Level 8
October 7, 2015

if you need the text it to stay white, try using an !important declaration to override any other styling. Text-decoration will keep it from being underlined, but color is a different property. And remember, most email clients like Gmail, Yahoo, etc. prefer seeing in-line CSS... It's painstaking, but it will help ensure your emails look the same across a variety of clients.

For example, for the Learn More text inside this 100% CSS button we use looks like this:

<a style="text-decoration: none; color: #ffffff !important; font-size: 18px; font-family: Arial, Helvetica, sans-serif;" href="info.stanleycss.com/2015PerimeterSecurity.html">LEARN MORE</a>

If it doesn't look cool, you're probably doing it wrong.
Andy_Varshneya1
Level 7
October 7, 2015

Good catch, Joe.