Change Blogger Comment Font, Size and Color
Blogger has released its much anticipated threaded comment system, and so far I'm loving it. Except for one thing - the font looks weird. So I changed the font back to how it was in the old system, and in this post I'm gonna show you how. By the way, a big shout and super thanks to Ekei Henshaw for her generous donation to SouthernSpeakers.
Step 1:
Go to Dashboard - Template - Backup/Restore - Download Full Template - Close - Edit HTML - Proceed - Find for /* Variable definitions - Paste the following directly below the lines (See image below)
Click on Save Template when you're done. Should you receive a bx error, delete Line 1 and Line 5 from the code above and try again.
Go to Dashboard - Template - Backup/Restore - Download Full Template - Close - Edit HTML - Proceed - Find for /* Variable definitions - Paste the following directly below the lines (See image below)
<Group description="Comment Font" selector=".comments .comments-content .comment-content, .ss">
<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"/>
</Group>
Click on Save Template when you're done. Should you receive a bx error, delete Line 1 and Line 5 from the code above and try again.
Step 2:
Still under Edit HTML, find for /* Comments ----------------------------------------------- */ - Paste the following under the dashed line
Click on Save Template when you're done.
Still under Edit HTML, find for /* Comments ----------------------------------------------- */ - Paste the following under the dashed line
.comments .comments-content .comment-content, .ss{
font: $sscommentfont;
color: $sscommentcolor;
}
Click on Save Template when you're done.
Go to Dashboard ('House' symbol) - Template - Customize - Advanced.
You should now see a new entry -- Comment Font. Click on it, and the rest is self-explanatory. Another thing. Since you cant view comments on the front page, you won't be able to preview the change using Template Designer. But clicking on 'Apply' will apply the changes. All the best!
Category Article Comments, Tutorial
