24 January 2011
11 January 2011
How To Change Height and Width of Comment Box in Blogger blogs?
You wanna look your Blogger blog different from others. There are numerous ways to do this. One is to customize the default height and width of comments box. Just follow the procedure:
Demo
Demo
03 January 2011
Add author information box below post to Blogger blog.
Author information box is now present on most of the wordpress blogs. It gives the info about the author and also contact info about him/her. It also makes your blog more attractive too.
Adding Author Information box:
Step 1
Go to Blogger dashboard > Design > Edit HTML. Click on expand widgets template.
Look for ]]></b:skin>
Add following code just above ]]></b:skin>
Step 2
Now look for footer-line-1
It will get <div class='post-footer-line post-footer-line-1'>
Now add following code BELOW it.
That's it.
Just edit the enformation from Step 2 code.
Adding Author Information box:
Step 1
Go to Blogger dashboard > Design > Edit HTML. Click on expand widgets template.
Look for ]]></b:skin>
Add following code just above ]]></b:skin>
.author_info {
float: right;
width: 573px;
padding: 10px;
border: 1px solid #e0e0e0;
margin-bottom: 15px;
margin-top: 15px;
background: #eee;
}
.author_info h3 {
margin-bottom: 10px;
}
.author_photo {
float: left;
margin: 0 0 0 10px;
}
.author_photo img {
margin-right: 10px;
border: 1px solid #e0e0e0;
}
Step 2
Now look for footer-line-1
It will get <div class='post-footer-line post-footer-line-1'>
Now add following code BELOW it.
<b:if cond='data:blog.pageType == "item"'>
<div class='author_info'>
<div class='author_photo'>
<img alt='author' src='http://3.bp.blogspot.com/_tbHfaj1A058/TSGc3fOc-NI/AAAAAAAAL7A/GU6dmnqINik/s1600/images.jpeg'/></div>
<h3>About the Author</h3> This article is written by: <a href='http://www.blogger.com/profile/00631616038549111257'><b>YourName</b></a> - who has already written <b>30</b> articles for <a href='http://medimania.blogspot.com/'>Medi Mania</a> YourName is a professional web designer. Catch him on <a href='http://twitter.com/yourID'>Twitter</a>, <a href='Your Facebook URL'>Facebook</a> or <a href='your e mail ID'>email</a> him <br> </br> <br> </br>
YourName's <a href='your web url'>Website</a><br style='clear:both;'/>
</div>
</b:if>
That's it.
Just edit the enformation from Step 2 code.





