You’ve found the perfect post if you’re trying to figure out how to style links in WordPress. If you use WordPress for your website, you’ll find all the information you need to format and change the appearance of the hyperlinks here, whether you want to underline the hyperlink, change its color, or change the hover color.
Blog posts aren’t complete without relevant links. They can be used to direct readers to other excellent content on your site (internal links), inside the same page (on-page links), or on an entirely different site (external links). These features are helpful for search engine optimization as well.
But when it comes to hyperlinks, many people mess up the formatting. The purpose of the link is, of course, to attract users to click on it. And the way to do this is to make them not just stand out from the other information on the page but also to use them in the proper spot with the correct anchor text. You can use several excellent formatting choices, such as changing their color, underlining, bolding, etc.
So, how do I set up links in WordPress? WordPress’s built-in editor allows you to format links manually or use a CSS style sheet to do it automatically. In addition, your WordPress theme may provide you with several predefined formatting options for the appearance of hyperlinks.
You can underline your hyperlinks manually by selecting the hyperlink’s text and pressing CTRL + U. This is similar to formatting on Google Docs or Microsoft Word.
However, if you want to automate this, you can underline hyperlinks by using the below CSS: Add this code to your Theme’s Function.php
.single-post .entry-content a {
text-decoration: underline;
}Changing the Color of Hyperlinks
Changing a hyperlink’s color is as simple as changing the color of any other piece of text. A simple plugin named “Advanced Rich Text Tools for Gutenberg” lets you select the linked text and modify the inline text color.
The CSS code below can also be used to change the color of every link automatically. The following CSS makes all hyperlinks appear in a deep blue tint. You are free to substitute any other color for “darkblue.”
single-post .entry-content a {
color: darkblue,
}How to remove underlining from hyperlinks
You may face an issue in that your WordPress theme applies a default underline to hyperlinks.
In such situations, you can use the CSS below to remove the underline and other formatting from the hyperlink.
.single-post .entry-content a {
text-decoration: none;
}Concluding Remarks
All the above methods can give your hyperlinks a more noticeable appearance. The formatting may be automated and uniform across your website with a small amount of CSS.
Rajat Singh, a versatile author with a decade of experience, explores every niche with unique insights, from tech and health to lifestyle and business.
