Tech Magazine

How To Give Your Blogger Blog Comment Section a Different Color

Posted on the 28 March 2013 by Babanature @proudlyonenaija

blogger threaded comment box

Ok! Let me tell you why I bring out this post topic today; I am creating a new blog and I am using blogger blog as the blog’s platform, I have customized all what I needed to be customize but I still feel it needed some final touch

;)
so the last thing I could think of is the comment section.

Now what I want the comment section to do is to be like; when I reply a comment I’d want it to get a different color from the other commentators so they’ll know I’m tha boss

:D
so I search high and low to finding my dream code and after a brief search, I saw one nice looking style. I know I have bloggers who uses blogger blog that do read my blog so that’s why I wanted to share this because I know you’ll by all means love what this gadget do.

Must Read: A Stylish Feedburner Subscription Form For Blogger and WordPress Blog

Giving Your Blogger Blog Comment Section A New look

So let’s not talk much and make the tutorial do the talking, shall we?

First off, login to your blogger blog admin section (dashboard)

Click on Template >>> Click Edit HTML. Now you’re in your HTML section where all the editing will be taking place.

Now search for this tag </body>

Remember: To make the search more easy, simultaneously press the ctrl + f key to bring out a search box.

Have you seen the code? Now that you have seen the </body> tag, paste the below code right above the </body> tag

 <script src='http://code.jquery.com/jquery-latest.js'/>

<script>

$(function() {

function highlight(){

$('.user.blog-author').closest('.comment-block')

.css('border', '1px solid #FFA500')

.css('background','#F1F1F2 url("http://1.bp.blogspot.com/-Z3-B5PNQqS0/UVPgNbTJ-kI/AAAAAAAABtU/eV0QKc9TSKI/s1600/white.png")')

.css('color', '#444444')

.css('font-size', '12px')

.css('padding', '10px');

}

$(document).bind('ready scroll click', highlight);

});

</script> 

If you have  pasted the code accordingly, click “Save” and close your work now go check your blog and see a whole new comment section.

Must Read: How to Write Quality Content And See Great Results

Note: If you’re using a white background template, you might want to adjust some few things in the code or it might not show the way you want it.

Ok if you’re using a white background, you should change the color from #F1F1F2 to the best color of your choice and change the background url which is “http://1.bp.blogspot.com/-Z3-B5PNQqS0/UVPgNbTJ-kI/AAAAAAAABtU/eV0QKc9TSKI/s1600/white.png” to your preferred color.

And you can customize virtually anything you want to and how you feel like.

That’s that… Go make your admin comment section look like a boss

;)

Wow… Do you have any questions you’d like to share? Please do by using the comment box below and we’ll get back almost immediately.

Must Read: How To Change the default avatar in blogger blog to a more professional look

Don’t read and go away friend, kindly drop a comment or thought using the comment box below. Remember that your comments and thoughts are highly appreciated and welcomed.

Do you like the post? Was the post helpful? Then do click the like button, share us and recommend us with friends because you’ll never know which of your friend’s searching for this gadget. Before you go, do not forget to subscribe to our feed for your latest updates on the go.

Don't Miss Any Post Again. Subscribe To Our Feed And Be Updated

Enter your email address below:

Powered by OnenaijaBlog


Back to Featured Articles on Logo Paperblog