Text Resize (+/-) for your blogger post
Tips and Tricks by
Thangaraju at Thursday, April 8, 2010
Share this post:
|
1.Log in to your dashboard--> layout- -> Edit HTML
2.Click on "Expand Widget Templates"
3.Scroll down to where you see this :
]]></b:skin>
4.Add below code before ]]></b:skin> tag.
.textresize {
padding-left:20px;
padding-top:5px;
}
5.Now add below code between ]]></b:skin> and </head> tags.
<script language='JavaScript' type='text/javascript'>
function changeFontSize(inc)
{
var p = document.getElementsByTagName('p');
for(n=0; n<p.length; n++) {
if(p[n].style.fontSize) {
var size = parseInt(p[n].style.fontSize.replace("px", ""));
} else {
var size = 12;
}
p[n].style.fontSize = size+inc + 'px';
}
}
</script>
6.Now again scroll down to where you see this :
<div class='post-header-line-1'/>
7.Add below code immediately after above line.
<span class='textresize'>
Text Size :<a href='javascript:changeFontSize(1)'> [+]</a> | <a href='javascript:changeFontSize(-1)'> [-]</a>
</span>
8.Now save your template and you are done.