How To Change Link Color In WordPress?

Adding links is quite easy in WordPress (press Ctrl+K) but do you know how to change link color in WordPress. Don’t worry, I’ll cover all of the options for changing link color in this article.

It is common to add links on the header, footer, in-post, pages, etc. Links are crucial for navigation and to make an article more visually appealing; nevertheless, another key purpose of links is to make an article SEO-friendly. Also, Read How to change the background color of a single page in WordPress?

Wait, Is It Worth Changing Link Color?

A big YES, most of the time. When you’re just starting out with your website, it’s a good idea to change the color of your links. During the development of your site, you may realize that the color of your links is not compatible with the theme’s elements.

Relevant link color, without a doubt, makes it easier for visitors to interact with the content and let them explore further pages. Even links are often not easily visible or striking, causing users to abandon the webpage.

In these scenarios, you must have to learn how to change link color in WordPress and improve user engagement along with SEO.

How To Change Link Color In WordPress?

There are several ways to change link color in WordPress including customizing the theme editor, adding CSS code, using plugins, etc. However, before you use any of the color-changing options, make sure you pick the right color for the link you wish to modify.

Before Begin, Pick The Right Color For The Link

The color combination is expressed in hexadecimal numbers and differs based on the color you have chosen. For example, the hex code for dark blue is #00008B, for orange is #FFA500, for cyan is #00FFFF, etc.

You don’t have to memorize these codes, just type hex color code on Google (or other search engines), and you can easily access the codes. Furthermore, you can also create your custom hexadecimal color code using online tools like htmlcolorcodes.com.

How To Change Link Color In WordPress Using CSS?

The easiest way to change link color in WordPress is by pasting the hex code into the CSS. Even if you don’t need to be a coding geek for this, any novice can do this. CSS (Cascade Style Sheet) enables you to customize the site’s elements and ensure how it looks.

• Go to your WordPress dashboard and look for the Appearance section.
• Inside this, click on the Customize button.
• It will lead to a new page where you edit every element of your website.

• Scroll down and look for custom CSS or additional CSS depending on the editor you are using.
• You can see a bit of code there. Without making any changes, just paste the below code under the CSS file.

a { 
color: #0000ff; 
}

• Here, a referred to anchor or link property and #000ff is the default blue hex code.

• Replace the #000ff with your selected hex color code in the previous step.
• Onc changes the link color, click on the Publish button at the top.
• Refresh the page and visit the links you have just modified.

How To Change Link Color In WordPress Using Theme Customization?

If you are not like the coding stuff (or are not familiar with it) then you should consider the theme customization option to change the color of a link. This method works differently on different themes and editors but the fundamental route is the same. Follow the below steps to modify the link color in WordPress.

• Go to your WordPress dashboard and select Appearance and click on Customize option as you did in the previous method.

• Inside general styling, you will get various options to change the link color.
• In other editors (like Gutenberg), you might get a colors option instead of styling to change the link color.

• All the editing options are available on the left sidebar of the page.
• Scroll down this side panel, you will get a section heading named Links Color.
• Here, two points are very important; 1st color and 2nd one is color: hover, you can modify both of them.
• By selecting and adjusting the color option, you can change the link color.

• By adjusting the color: hover, you can alter the link color when any hover the mouse over it.
• You don’t need any hex color code in this method.
• Just select any color from the color palette and click on the publish button at the top one selected color of your choice.

How To Change Link Color In WordPress Using Elementor Page Builder?

Elementor is unarguably the most popular WordPress page builder with tons of premium customization. If you are also using elementor then you can easily change the link color in WordPress. Also, Read How to change font color in WordPress?

• Go to your elementor dashboard and click on the three parallel lines menu at the upper left corner.

• From the menu options, select the Site Settings option.
• It will open up new options, select the Typography option.

• Scroll down and look for the Link section.
• Here, you have two columns; Normal and Hover.
• Under the Normal section, you have a color option. Click on the global icon in front of the color option.

• Pick the color of your choice and update the settings.
• You can also modify the hover link color by selecting the hover tab instead of the normal tab.

How To Change Link Color In WordPress Using Plugin?

Plugins are obviously the quickest and easiest way to change link color in WordPress especially if you don’t want to entangle with settings and codings. The recommended plugin is SiteOrigin CSS which you can directly download from the plugin directory.

• Install and activate the SiteOrigin CSS plugin.
• Go to the Appearance section and select Custom CSS (this will be added once install the plugin).
• Click on the eye button at the top right corner to launch the visual editor.
• Now, click on any link whose color you want to change.

• On the left sidebar, all the related details display on the screen.
• Here change the link text color, size, font style, etc of any link you have created or want to create.
• Click on the Save button once you selected your link color.

How To Change Individual Link Color In WordPress?

The above-mentioned method enables you to change the link color of an entire website, however, you can also change the link color of an individual link. This method is quite simple as you can change the color from the editor itself.

• Open any post in which you want to change the link color.
• Add a link from the link icon or by pressing (Ctrl+K).
• Otherwise, select the text of the link (by double-tap or shortcut keys).
• From the tool tab at the top of the editor, select the text color (A) button.

• Now select the color of your choice and you can see the instant color change of the text of the link.
• Save the draft and check with the preview if everything has gone well.
• Remember, this method works effectively on the classic editor, you might have to click three dots and then select the text color option in the Gutenberg editor.

Final Thoughts

It is all about how to change link color in WordPress in simple ways. In this article, we have learned 5 different methods to change the color of a link in WordPress including changing the color of an individual link. These methods work well in any theme and any WordPress editor including classic and Gutenberg.

You don’t really need any technical skills or WordPress hidden keys to change the color of any link; simply follow the instructions above. The simplest and short way to change a link color is to paste a one-line code in your CSS file as discussed in the first method.

I hope you enjoyed this article, and if you have any challenges adopting the aforementioned methods, please let me know in the comments.