How to Change Link Color in WordPress (With Hover & Visited)

change link color

WordPress is an amazing CMS, where you can do almost anything you want. You can keep your site as it is by default or color it like you want. WordPress allows you to color its links with simple HTML codes. 

If you don’t know how to change link color in WordPress, then this post is for you. Here, you won’t have to become a programmer or learn any programming language. Just follow this post, and then you will be able to change link color by yourself.

Let’s see.

To change link color, follow the steps below and then do it yourself.

Step 1: Open Editor

First, Navigate to Appearance -> Editor. 

Step 2: Open Colors in Styles

Click on Styles. 

Then hit Edit Styles. 

From here, you will be able to change different styles. To change link color, click on ‘Colors’. 

To change link colors, click on the link. 

From here, choose any color that you want to see on your link. 

This process is similar to changing the link color. All you have to do is repeat step 1 and step 2 from ‘Change Link Color.

Then, click on the link and then toggle the Hover tab. 

Then choose the color you want. 

To change link color using CSS, first, log in to your site dashboard and navigate to Appearance -> Customize

Now click on additional CSS. 

Enter the following code and hit the publish button. 

a {
  color: #800000;
 }

Here, “#800000” is the color code, and it will show Maroon color. You can put your desired color code and update the link color.

Similarly, to change link hover color, just put the below code in the additional CSS option. 

a:hover {
color: #008000;
}

Then change the color code to whatever you want and don’t forget to hit publish button. WIth the color code #008000, your link hover color will show as green.

To change the visited link color, you have to modify the code slightly. Just replace “hover” with the word “ visited”. Or you can simply put this code on the Additional CSS option and hit the publish button.

a:visited {
color: #FFFF00;
}

Now the color for the visited link will turn yellow. 

If you want to change link color, link hover color, and link visited color all at once, then paste the following code and change the color code as you like.

a {

    color: #800000;
   
   }
   
   a:hover {
   
     color: #008000;
   
   }
   
   a:visited {
   
     color: #FFFF00;
   
   }

Conclusion

Isn’t it easy to change the link colors? Now bring the changes and give different colors to your links. Some of the common HTML color codes are white (#FFFFFF), Red (#FF0000), Silver (#C0C0C0), Gray (#808080), Maroon (#800000), Green (#008000), Yellow (#FFFF00). 

I hope this post helped you to learn how to change link color in WordPress. If you liked the post, share it with your friends, and don’t forget to comment your thoughts in the box below. 

Was this helpful?

Thanks for your feedback!

Leave a Reply

Your email address will not be published. Required fields are marked *

Introducing New Table Block Plugin - Tableberg

X
Need help?