Skip to main content
Visit Freshworks.com Visit Freshworks

Recently trying to create articles with the existing “User Guide” template. I happen to struggle with the font color of anchor links. They look okay with the Editor as the anchor links are colored blue.

 

Editor screen

However, when I move to the preview screen few of the anchor links seem Black, just  like a normal text. I force change the text color to Blue, but to no help. Is it just me who faces this problem?

Preview Screen

 

@chmohanta 

 

Welcome to Freshworks Community!

If an anchor link is only showing the link when hovered over, it might be due to the CSS styles applied to the link.


As a workaround, the hover effect can be adjusted or removed using CSS.. Here is an example:


Switch to the code view in an article

Article body:

Check out this article link

Add the following line in the code view to update the color of the anchor tag 

style="color:blue;"

Updated Code view appears as follows: 

<p dir="ltr"><a dir="ltr" href="https://community.freshworks.com" style="color:blue;">Check out this article link</a></p>

 

I hope it works as expected. You can also drop an email to support@freshdesk.com, our team can further investigate on the anchor tag behavior. 
 

We offer a Complimentary consultation service to help our users determine the best course of action for their specific requirements. If you're interested, please Click here to book a 1:1 consultation session with our product expert.


Regards
Aarthi
Product Consultant- Freshdesk Omnichannel

@chmohanta

 


If an anchor link is only showing the link when hovered over, it might be due to the CSS styles applied to the link.


As a workaround, the hover effect can be adjusted or removed using CSS.. Here is an example:

...

 

It seems that the colours that are set for links when you customise the portal are getting overridden in CSS.  As a workaround, I have added the following custom CSS:

 

.fw-wrapper-shadow .fw-content--single-article a {
  color: var(--fw-linkColor)
}
.fw-wrapper-shadow .fw-content--single-article a:not(.fw-attachment-item):hover {
  color: var(--fw-linkColorHover)
}
.fw-wrapper-shadow .fw-content--single-article a:hover {
  color: var(--fw-linkColorHover)
}

 

Reply


Terms of Use