How to Change Link Color in WordPress using css

How to Change Link Color in WordPress

2 minutes read

Tutorials

Although WordPress can do amazing things, it can also be painful. It’s possible that you would wonder how to adjust the color in WordPress if you look at this page. In WordPress, we can precisely demonstrate How to Change Link Color in WordPress.

It can be difficult if you do not have coding experience and cannot find an alternative to make a particular change.

You can change the link color for WordPress from your theme settings whether you are using a free WordPress theme or a theme with limited choices. However, you can do it with quick CSS tweaks.

Detailed coding information is not mandatory. These simple steps can only be practised. Here’s How to Change Link Color in WordPress.

How to Change Link Color in WordPress Using CSS

  • Log into your WordPress WordPress.
  • Proceed to Appearance >> Customize.
  • You can see a link on the bottom left that says “Additional CSS” Just press it.
How to Change Link Color in WordPress Using CSS
  • In the box, add the following code (and make sure that you do not erase current CSS).
a {
  color: #0031FF;
 }

The “a” means “anchor,” which means we define an “anchor” rule (“link” for HTML). Our property is “Color” and is set to “#00ffff” which means “Bright Blue.”

List of common HTML color codes

Color NameHex CodeRGB Code
White #FFFFFFrgb(255, 255, 255)
Red#FF0000rgb(255, 0, 0)
Silver#C0C0C0rgb(192, 192, 192)
Gray#808080rgb(128, 128, 128)
Maroon #800000rgb(128, 0, 0)
Green#008000rgb(0, 128, 0)
Yellow#FFFF00rgb(255, 255, 0)

How to Change Link Hover Color

This CSS block will cause the link’s text to become Green if a user hovers over a link. This color is a mess for your design, but try to choose a color suitable for your topic. Notice that the “a” block and the “a: hover” block are also part of the “styles.css” format.

a:hover {
color: #008000;
}

How to Add The Visited Link Color

A tutorial on how to change the WordPress link color will not be completed without looking at switching the color of links a user has visited.

a:visited {
color: #FFFF00;
}

It will make the link color yellow after an user press the WordPress link.

Note: You must add the code with the same format at below.

CSS Code

a {

    color: #0031FF;
   
   }
   
   a:hover {
   
     color: #000000;
   
   }
   
   a:visited {
   
     color: #B800FF;
   
   }

Video tutorial

Sum Up

It’s challenging to change the link colors, whether you run a WordPress blog or a WordPress website. You should still rely on a competent provider if you don’t know how to make those improvements.

I hope that this post has helped you learn How to Change Link Color in WordPress. Besides, some visitors also asked us How to Underline in WordPress. Do check the article.

If you enjoyed this post, subscribe to our WordPress video tutorials on YouTube Channel. Remember to follow us on Pinterest.

We accept any type of suggestions from the visitors because it always motivates us to improve. Feel free to comment below.

What do you think?

Leave a Reply

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

Fill out this field
Fill out this field
Please enter a valid email address.
You need to agree with the terms to proceed

Related Articles

Menu