Do you wish to learn how to change the link color in WordPress?
Doing this give you power over the design of your site which can be easier for your users to navigate.
So we will show you step by step on how to change the link color in WordPress
What is Link Color in WordPress?
Contents
Your WordPress site’s link color is defined by the theme you use. If the theme doesn’t specify a rule for link color, then the default color by the browser is applied. As a rule of thumb, link should be styled in a way that visitors know that is a link
Why You Need to Change your Link Color in WordPress?
When adding a link in WordPress, your WordPress theme automatically determine the color of the link, Sometimes your WordPress theme’s default color options will be exactly what you want, but other times you’ll want more control over how the links look.
Some themes allow you to change the link color directly from your theme options panel or the WordPress theme customizer, that why you need to check your theme documentation before changing the link color with CSS.
let’s take a look at a few ways you can change the link color on your WordPress website.
How to change Link Color in WordPress
Change Link Color in WordPress Using Theme Editor CSS
There are ways to change the link color in WordPress is by adding custom CSS code.
First, you need to do is navigate to your WordPress admin dashboard and go to Appearance » Customize and then click the ‘Additional CSS’ menu option.
This will bring you to a screen where you can add your custom CSS code on the left side of the page.
You’ll be adding the CSS code snippets from this section of your editor.
To customize the overall link color which is the color that your visitors will see if they’ve never clicked the link before.
Then you use the CSS code below.
a {
color: #0084b1;
}This will change the default link color to purple. Make sure you change the ##0084b1 color to the color you want to use.
Change the Link Hover Color in WordPress Using Theme Editor CSS
The next thing we’re going to change is the link hover color. That way, when a user hovers their cursor over a link, it will change color to get their attention.
You can use the CSS code below as an example.
a:hover {
color: #0031FF;
text-decoration: underline;
}The code above will change the link color to blue and underline the text when visitors hover over it. Make sure to change the #0031FF color to the one you prefer.
Change the Link Color After Visit in WordPress Using Theme Editor CSS
You may want to change is the link color after a user clicks a link. This helps visitors easily navigate your WordPress blog and see which links they’ve already clicked on.
a:visited {
color: #FF0000;
}The code above will change the link color to red.
Once you’ve made your changes, click the ‘Publish’ button to make your changes live.
The CSS code above will change the color of all the links on your site. You can add the codes together and it will bring out single results.
Change the the links that are in your posts and pages Using Theme Editor CSS
If you want to only customize the links that are in your posts and pages, then you can use the code sample below.
.entry-content a {
color: #FF0000;
}
.entry-content a:hover {
color: #0000FF;
text-decoration: underline;
}
.entry-content a:visited {
color: #FF0000;
}Note: .entry-content only targets links within your content.
If you don’t want to add code directly to your WordPress theme, then you can use a CSS plugin to add code to your website.
That way, your CSS changes will be applied even if you decide to change your WordPress theme.
First thing you need to do is install and activate the Simple Custom CSS and JS plugin. For more details, see our step by step guide on how to install a WordPress plugin.
Upon activation, simply go to Custom CSS & JS » Add Custom CSS in your WordPress admin panel.
Once you’re done adding the code, make sure to click the ‘Publish’ or ‘Update’ button.
We hope this article helped you learn how to change the link color in WordPress. If you have any issue on this, you can use our comment session or join our delegate on facebook to solve any issues related to WordPress and subscribe to our YouTube Channel for WordPress video tutorials.