With the new threaded comments on Blogger, replying to comments is easier and more fun. The comment thread is where the conversation between the author and his readers takes place. And I just thought that it would be pretty cool to have a different font style for the comments.
So with my OCD in overdrive, I finally found a way to do just that.
 |
| From this... |
 |
| ... to this. |
And if want to do the same, you could follow these simple steps. Before doing any edits on your blog HTML, be sure to backup your template. As this is important, I will say it again.. backup your template.
- On the new Blogger dashboard, go to Template.
- Click Edit HTML.
- Click Expand Widget Template.
- Find this code /* Variable definitions. To do that, click CTRL+F, and paste the code in the search box.
- Paste the following codes just below the dashed lines.
<Variable name="sscommentfont" description="Comment Font" type="font"
default="normal normal 100% 'Trebuchet MS', Trebuchet, Verdana, Sans-serif" value="normal normal 100% 'Trebuchet MS', Trebuchet, Verdana, Sans-serif"/>
<Variable name="sscommentcolor" description="Comment Color" type="color" default="#000000" value="#000000"/>
- Find this code /* Comments.
- Paste the following codes under the dashed lines.
.comments .comments-content .comment-content, .ss{
font: $sscommentfont;
color: $sscommentcolor;
}
When you're done, go to your Blogger Template Designer. You will be able to see 2 new entries - Comment Font and Comment Color.
I'm using the dominant colors in my blog - orange and green. The font is italicized Georgia. But with these new options, I could change font face, style, size and color of the comments anytime. Do let me know if these colors make the comments hard to read. I will changed it back to grey.. or blue, maybe. No problem there, I've got a lot of choices.
If you're happy with the way the comments look in your blog, then there is no need to edit anything. But if you want to do the changes, just follow the instructions and you'll do fine. Just remember to backup your template first. You will need them, just in case the codes don't work on your blog. Good luck!
font: $sscommentfont;
color: $sscommentcolor;
}
- Click Save Template.
When you're done, go to your Blogger Template Designer. You will be able to see 2 new entries - Comment Font and Comment Color.
 |
| Entries: Comment Font and Comment Color |
I'm using the dominant colors in my blog - orange and green. The font is italicized Georgia. But with these new options, I could change font face, style, size and color of the comments anytime. Do let me know if these colors make the comments hard to read. I will changed it back to grey.. or blue, maybe. No problem there, I've got a lot of choices.
If you're happy with the way the comments look in your blog, then there is no need to edit anything. But if you want to do the changes, just follow the instructions and you'll do fine. Just remember to backup your template first. You will need them, just in case the codes don't work on your blog. Good luck!
* Codes: Southern Speakers
Yeah this is cool, and more fun. I am still satisfied with the current colors of my comments but when I get bored, I'll resort to using this. I'll email it right now to my self. Hehehe.
ReplyDeleteSure, sure! Gawin mo lang pag feel mo na. hehe.. And be sure to update me kapag gumana sa blog mo ha. :)
DeleteOf chors, I'll let you know. Hehehe.
DeleteOoooh.. Love this color sis! :D It looks nice and fun. Will try this soon on my blog too ;)
ReplyDeleteThanks, ms Sumi! :)
DeleteWell I think mine are fine how they are but I like again that you wanted to find something out so went for it :)
ReplyDeleteYeah. It is a great feeling! :)
DeleteWhen I know that there is a solution out there, I keep trying to find it. I get frustrated when I don't.. And it's also a good thing that I came across this one blog (Southern Speakers), it's a great blog for tutorials and HTML editing..
This is so nice.... thanks sa turtorial... will try this nga...
ReplyDeleteSure, sure. Backup your template muna ha. :)
DeleteOh hey, that's me! I'm a star now, right? 8D
ReplyDeleteGreen is always a good colour to go with. Can never go wrong, really!
Yes! That's you! XD
DeleteI think green and orange is a cool combination. The color wheel suggests that green and red is better, or orange and blue.. but oh heck, the green/orange combo works for me. :) With these colors, the comments are still fairly easy to read, right? Not too hard on the eyes?
finally for blogger! but still i'll recommend disqus for any blog.. :)
ReplyDeleteThe problem with disqus, it doesn't load sometimes.. But yes, it is great for comment threads. :)
DeleteThis is new to me.... im loving the colors here... totally different...
ReplyDeleteEigroj Stain
Well, I'm glad I showed you something new. ;) Thanks.
DeleteIt's ice to play with colors to our blogs .I do it sometimes but will end up with the old color and fonts.
ReplyDeleteIt's nice to experiment with colors.. you'd eventually find out what color suits your personality and your blog. :)
Deletethanks for this! hahaha! i just hope there is a way to be notified of reply to comments without spamming my email... if you know some solutions to this, let me know. =)
ReplyDeleteSa pagkakaalam ko lang po, you could be notified of replies by subscribing by email. So sa email lang talaga matatanggap ang notifications. I'm not sure if there is any other way..
DeleteWell, if you're using Gmail, I think there is a way to make the notifications from Blogger go to one folder. I used that sa Google+ profile ko. All the notifications from G+ goes to the G+ folder I made. Hindi ko lang maalala kung panu ko ginawa yun. Haha! But I remember, it was a tutorial from Taragis.com. I will get back to you on this one..
Bookmarked. Thanks for the tut mam Leah :) I'll try this pag inatake din ako ng OCD ko, haha. Problema ko lang kasi, nakakatamad mag edit ng html kung ikaw pa mismmo maghahanap. Buti na lang meron nito, ctrl+F na lang, haha.
ReplyDeleteHaha! Yes po.. CTRL+F is the way to go. Hirap nga namang hanapin talaga ang codes, lalo na pag hindi mo alam kung saan banda.. hehe. :)
Deletei used to do this also before, tweaking and experimenting on blogs..hehehe..but when i moved to wordpress, di na masyado..hehhe..i miss this one..
ReplyDeleteIt's a great feeling, diba.. when you edit your codes and it works! Achievement! lol.. I have a Wordpress blog, pero hindi ako marunong magexperiment dun. hehe..
Deletewow thanks for the share Leah
ReplyDeleteYou're welcome. :)
Deleteoh,,, thanks for making post about this,, try q to sa blog q,,,
ReplyDeleteSure po. Make sure to backup your template, just to be on the safe side. Let me know if it works, Kuya. Thanks..
DeleteNice... it should have a variety to get rid of monotony and also to make your comments attractive. Very nice!
ReplyDeleteThank you, sir.. :)
DeleteAng cool ah, I wonder if this, too, is possible with Wordpress.
ReplyDeleteHmm.. hindi lang po ako sure, Ms N. :)
DeleteOh, this is cool! I know how to do this too but in a different way naman. It's fun diba?? Nakakatuwa when you make changes with tweaking!
ReplyDeleteHehe.. Yes! It is fun! But of course, we have to be careful rin. Kaya kelangan talaga backup muna ang template bago mag edit-edit. hehe. :)
DeleteThanks for sharing Leah, I'll try this one too. :)
ReplyDelete~Talinggaw
You're welcome! :)
DeleteCan't wait to try this out on my blog! Thanks so much for posting about this :-)
ReplyDeleteYou're welcome. Don't forget to backup your template first. Good luck! ;)
DeleteHehe! this is only good for girly sites like yours :)
ReplyDeleteHahaha! True. It'll be awkward to have this on tech blogs. :D
DeleteNice and simple comment box! but i'm currently using Disqus but sometime's it doesn't work well :<
ReplyDeleteI tried it once. Hindi lang sya swak sa blog ko. The only problem with Disqus, sometimes it doesn't load properly. But yes, it is great for comment threads. :)
Deleteround 2! :D
ReplyDeleteI actually love this font...so girly..
as much na gusto ko rin tong gawin sa blog ko takot ako mag tweak ng template ko..
My meme ako na hino-host Orange Tuesdays obviously because I love orange..and love ko din ang green..feeling maka-nature lang..
Yes, pumasok din! Round2! :D
DeleteThis font is the ever simple Georgia. Italicized. Well, if you're hosting Orange Tuesdays, then it is pretty clear that you love orange. :) Interesting.. Baka magjoin ako sa meme na yan, one day someday. :)
blogger or blogspot just keeps getting better and better... of course, if you are already happy with how your comments look then there is no need to change it...
ReplyDeleteYes, of course. If you're happy with how your comments look, there's no need to do this. This is just an option.. to those who want to make their comment threads look more attractive with different fonts and colors. :)
DeleteGreen is always cool to the eyes. Thanks for this post. This will help a newbie like me.
ReplyDeleteTrue that. You're welcome. :)
Deletetalk about being meticulous.. well it has merits after all...
ReplyDeletehaha. True. :)
DeleteYou're such a html wiz! The blog's looking great and lurrrrrving the green
ReplyDeleteaww.. Thanks, Cindy! I just love experimenting with my blog. But I'm not a whiz. hehe.. That honor should go to YOBOY. He is the author of the blog, SOUTHERN SPEAKERS. I left a link of his blog on the post above. Do check him out for some more tutorials. :)
Deletehey this is nice.. sige nga ma try.. I want mine red.. hehe ;)
ReplyDeleteGo ahead! make yours red. :) Backup your template first before doing any tweaks. :)
DeleteI wanna try this but too tamad right now
ReplyDeleteOhh yeah! Ang clever na man! May ganyan din ba sa wordpress? Want mine to be blue or red! Cute2x.
ReplyDeleteI'm not sure po kung meron sa Wordpress. Malamang, meron pero hindi ko alam kung panu gawin. hehe..
Deletei'll try this out soon! :>
ReplyDeleteI want to revert back to blogger. Hmph. Ngayon lg kasi to. Huhu. Y o y.
ReplyDeleteBookmarked! Matry nga bukas :)
ReplyDeleteLet me know if it works on yours, Algene! :)
DeleteTry ko nga din to kung gagana sa blog template ko
ReplyDeleteI'm pretty sure it works on default Blogger templates. Go ahead, try nyo po. Let me know if it works on yours. Back up your template first.. :)
DeleteAte Leah, I've tried many times na gawin yung threaded comments sa blog ko. Pero di ko parin magawa. huhu... Panu ba yown? :c Can you post a tutorial link na madali sundan po? Thank you :)
ReplyDeleteCustom template kasi ang gamit mo, Lily.. pero merong tutorial kung panno gumana ang comment threading on customized templates. Just not mine.. Nabasa ko lang din. Share ko lang sayo. I'll leave a comment on your blog. :)
DeleteThe tutorial worked on my blogs ate. Maraming maraming salamat sa pag-share nung link!:))
DeleteThat's good to know. You're welcome, Lily. :))
DeleteI will try this when I have time. Have a nice day!
ReplyDeleteI will be trying this very soon coz I'm planning to make another blog from blogger. :)
ReplyDeletenice! I actually tried but failed :-( hu hu hu!
ReplyDeleteAwww.. bakit kaya? :(
DeleteNapakahelpful ng post na toh Ate Leah! Sadly, hindi ko siya maaapply kasi may template na kakaiba yung blog ko at kukutingtingin ko manually yung codes para mahanap ang nagpipigil sakin upang magkaroon ng threaded replies... huhuhu
ReplyDeleteAw. Ayos lang yun.. Yes, you do have a customized template. Mahirap na baka masira ang buong blog.. So it's better na wag na lang. Dami mo pa namang fans. Baka magalit lang sila sakin, Stephie. hihi..
DeleteThanks for sharing these tips. Personally, I like the previous one though =P
ReplyDeleteYou're welcome! :)
DeleteWell, I think I'd revert back to the grey font color if I get many complaints. But for now, I'd stick with the green. Plus, it's also to show you that the codes DO work. :)
Thank you for sharing this! nice tips.i will keep tab on your post just in case i would have time and spruce up my blog some more!
ReplyDeletewow! I've been waiting for this tutorial. yey! at last. thanks for sharing :)
ReplyDeleteThank you! This will be very useful. :-)
ReplyDelete