A blog about cutting edge technology at its maximum pace.

Ritesh Warke On Monday, April 25, 2011
This widget will show article author, author image and about author, similarly like the widget bellow this post. The widget will also work for blogs with multiple authors. Before getting started, download your current template if anything goes wrong ahead.

1. Login to your blogger account > Design > Edit HTML.
2. Tick Expand widget Template.

3. Search for

<div class='post-footer'>

4. And paste the following code below it:
<b:if cond='data:blog.pageType == "item"'>


<b:if cond='data:post.author == "AUTHOR_NAME_1"'>
 
<div style='background: #F9F9F9; border: double #DDD; padding: 5px;'>

 
<div style='font-size: 16px;'>
<b>Article By: <data:post.author/></b>
</div>

 
<a imageanchor='1' style='float: left;'><img alt='Blog Author' border='0' src='BLOG_AUTHOR_PIC 64x85'/></a><br/>
<b>LITTLE DESCRIPTION ABOUT AUTHOR</b><br/><br/>
If you like this post you can follow YOUR BLOG NAME on <a href='TWITTER_LINK' target='_blank'>Twitter</a> and on <a href='FACEBOOK_LINK' target='_blank'>Facebook</a>.<br/>
Subscribe to YOUR BLOG NAME feeds via <a href='FEEDBURNER_LINK' target='_blank'>RSS</a> or <a href='http://feedburner.google.com/fb/a/mailverify?uri=YOUR BLOG NAME&loc=en_US' target='_blank'>Email</a> to receive instant updates.

 
<br/><br/>

 
</div>

 
</b:if>



</b:if>

5. Change the CAPS letter in blue as reqiured.

6. IMP: AUTHOR_NAME_1 should be same as in the author blogger profile or the widget won't work. Profile can be updated from here > http://draft.blogger.com/edit-profile.g

7. If you have multiple authors copy the code in black color, italic and paste just before the last </b:if> tag . Don't forget to update the code for multiple author.

8. BLOG AUTHOR PIC should be of the size 64x85 pixels

Example of the widget for multiple authors:

<b:if cond='data:blog.pageType == "item"'>


<b:if cond='data:post.author == "AUTHOR_NAME_1"'>


<div style='background: #F9F9F9; border: double #DDD; padding: 5px;'>


<div style='font-size: 16px;'>
<b>Article By: <data:post.author/></b>
</div>


<a imageanchor='1' style='float: left;'><img alt='Blog Author' border='0' src='BLOG_AUTHOR_PIC'/></a><br/>
<b>LITTLE DESCRIPTION ABOUT AUTHOR</b><br/><br/>
If you like this post you can follow YOUR BLOG NAME on <a href='TWITTER_LINK' target='_blank'>Twitter</a> and on <a href='FACEBOOK_LINK' target='_blank'>Facebook</a>.<br/>
Subscribe to YOUR BLOG NAME feeds via <a href='FEEDBURNER_LINK' target='_blank'>RSS</a> or <a href='http://feedburner.google.com/fb/a/mailverify?uri=YOUR BLOG NAME&loc=en_US' target='_blank'>Email</a> to receive instant updates.


<br/><br/>


</div>


</b:if>


<b:if cond='data:post.author == "AUTHOR_NAME_2"'>


<div style='background: #F9F9F9; border: double #DDD; padding: 5px;'>


<div style='font-size: 16px;'>
<b>Article By: <data:post.author/></b>
</div>


<a imageanchor='1' style='float: left;'><img alt='Blog Author' border='0' src='BLOG_AUTHOR_PIC'/></a><br/>
<b>LITTLE DESCRIPTION ABOUT AUTHOR</b><br/><br/>
If you like this post you can follow YOUR BLOG NAME on <a href='TWITTER_LINK' target='_blank'>Twitter</a> and on <a href='FACEBOOK_LINK' target='_blank'>Facebook</a>.<br/>
Subscribe to YOUR BLOG NAME feeds via <a href='FEEDBURNER_LINK' target='_blank'>RSS</a> or <a href='http://feedburner.google.com/fb/a/mailverify?uri=YOUR BLOG NAME&loc=en_US' target='_blank'>Email</a> to receive instant updates.


<br/><br/>


</div>


</b:if>


</b:if>

If any error have occurred while installing the widget please comment below. If you have any query or suggestions on About Author Widget For Bloggers Similar To Wordpressplease feel free to comment below.

0 comments:

Post a Comment

New Users Register Here