How to Change the Default Text Selection Color with CSS in Blogger

Advertisements
One of the coolest ways of selecting a text on a website is to drag your mouse all over the content. While Selecting Text or any other element either on a website or, on your desktop screen a Highlighted color appears, this helps us in the selection. Mostly, the selected area is highlighted with blue color (Default). So what are your thoughts, about changing that highlighted color to something that matches your color scheme? It would give a new touch to your website. We utilized Webkit Just like we did in our previous Scrollbar Modification. The technique is extremely straightforward that it takes seconds to complete. Today in this article, we will learn How to Change the Default Text Selection Color with CSS in Blogger.
 
The coolest CSS3 declaration that a person can use today is ::selection, which overrides your default text highlighter color with a color of your choice. At the moment, it works on almost each and every browser that supports Webkit. It’s a sufficient technique that works on modern browsers. However, it gets ignores in old browsers, so it doesn’t make a rich impact. 

How to Overriding The Default Text Selection Color With CSS:

There is no rocket science behind it because the ::selection code does the job with perfection. So to add custom Highlighter Text selection color in your Blogger platform does as follows. (Remember: This tutorial would also work on WordPress or any other platform built with HTML). 
  • Go To Blogger >> Template >> Edit HTML >> Proceed.
  • In the template, search for ]]></b:skin> tag and above it paste the following coding.
::-moz-selection {
    background-color: #ffb7b7;
    color: #fff;
}
::selection {
    background-color: #ffb7b7;
    color: #fff;
}

  • Replace #ffb7b7 with your personalized color and save the template.
All Done: That’s it. Go ahead and check your website we are sure that it would give picture perfect results. This technique may appear small, but its results are delightful. If someone has any questions then, feel free to leave your comment below. 

Advertisements

The Editorial Team of MyBloggerLab consists of a group of Professional Blogger geeks Led by Syed Faizan Ali (Founder of MyBloggerLab).

Comment With:
OR
Choose Wisely!

4 comments

December 18, 2012 at 12:23 AM

Wow.. too much appreciated.. I like it bro, very nice...

December 18, 2012 at 12:25 AM

I saw text selection going green on techcrunch

December 18, 2012 at 5:46 AM

is there any trick to change the text color while selecting text? i mean it always stays white.

Editorial Team MOD
December 19, 2012 at 12:04 AM

So Far, I am not aware of thing but once we would find it we will let you know. Peace

Post a Comment

We’re eager to see your comment. However, Please Keep in mind that all comments are moderated manually by our human reviewers according to our comment policy, and all the links are nofollow. Using Keywords in the name field area is forbidden. Let’s enjoy a personal and evocative conversation.

Helping You to do Cool Things With Blogger Since 2012™.

© Copyright 2012 - 2016. MBL Networks, All Rights are Strictly Reserved.