How to Highlight Links in Blogger Posts - Techfint | Find the Technology

Friday, December 14, 2018

How to Highlight Links in Blogger Posts

How to Highlight Links in Blogger Posts


Change link color in blogger post | The links we given in the blog posts have a crucial role in blog seo.when we put links of related articles in a post, it will make the people spend more time on our blog,this will helps to reduce the bounce rate of the blog, and also in terms of ranking.





For a new blogger, this is a big deal if he uses blogger blog, Most of the free templates doesn't have a code to highlight the links, but some of the templates highlight links when we mouse over it. but it doesn't make any sense if a reader can't see the link when he reaches an article. Who's going to check your article top to bottom for links..Change link color in blogger post

But by a simple method, we can do it manually. First, you need to identify your problem

Understand the problem


  1. Links are highlighting when you mouse over it
  2. Links never highlighting





Probably your theme may be customized to highlight the links when a reader mouses over it, or at the moment when it is clicked, or it may not be customized to highlight links. Change link color in blogger post

Warning! Take a backup of your theme Before making any changes. Change link color in blogger post

Understand the codes


With CSS codes, we can style the links in a different way


/* unvisited link */
a:link {
color: red;
}

/* visited link */
a:visited {
color: green;
}

/* mouse over link */
a:hover {
color: hotpink;
}

/* selected link */
a:active {
color: blue;
}

a: link - a normal unvisited link
a: visited -   a link user has visited 
a: hover  -  a link when the user mouses over it
a: active  - a link the moment clicked 

Fixing the problem


The links are highlighting only when a user mouses over it.

This is because your theme is customized to only highlight links when a user moves the mouse over it. Change link color in blogger post

maybe the code to highlight the link already there, but by default, the color would be $maincolor (default color of your fonts)

we need to check does it have the code or the color code is different from the font color of your blog. Change link color in blogger post

Go to themes > edit HTML  and press ctrl+f  inside the editor, type a: visited or a: hover and search it. you can see a: hover at many places so look carefully and identify the code section. most of the time the first a: hover or a: visited be the code we need to edit.


Change link color in blogger post

If it has only this code

a:hover{
color:#ff00000;
}

Then add this code just above it

a:link{
color:colorcode;
}

If you found the a: visited code like this

a:visited {
color:$maincolor;
}

Just change the $maincolor and replace your color code. Change link color in blogger post

If you can't find none of the above codes then just copy & paste the code given below,  just above the ]]></b:skin> code


The CSS code


a:link {
color: #;
}
a:visited {
color: #;
}
a:hover{
color: #;
}code-box


Replace # with the color code you like and save. Don't do anything more if you have no idea about coding. Change link color in blogger post

Now open your any post and check whether it works.

  • note > If the above code, not works try these code

.post-body a {
color:#;
}
.post-body a:link {
color:#;
}
.post-body a:visited {
color:#;
}
.post-body a:hover {
color:#;
}code-box


Now save your theme by clicking the save button. Change link color in blogger post

you can delete a: hover code if you don't want to change link colour when a user mouse over it.

If you don't know how to add CSS then do it this way


Go to Theme > customization > Advanced > Add CSS.



Paste the CSS codes here and click apply to the blog. Change link color in blogger post

That's all, now you have made it

Conclusion 


In this tutorial, we discussed how to highlight links in blogger posts. I hope you found this tutorial useful. If so, would you consider sharing it with others who might appreciate it as well?

Change link color in blogger post

If you have any doubt regarding this post please comment below

Also read 



A professional content writer and tech savy. He love to explore new stuff and explain it in a simple way. No matter what and how complicated it is

Disclaimer: This post may contain affiliate links that earn me a small commission, at no additional cost to you. I only recommend products I personally use and love, or think my readers will find useful.
Read other related articles
© Copyright 2019 Techfint | All Rights Reserved