How to Add "About Author" box below every blog posts in Blogger

Ok! Some one see my About author box in every posts and ask me how I keep it,here is the trick which I do follow the procedures below

1. Go to Edit HTML page in Blogger and tick the "Expand Widget Templates" checkbox above the top right corner of the template code box.

2. Now find for the ]]></b:skin> code using CTRL+F and replace it with the code below.

/***** Author Box ********************/

.author-box {
background: #F7F7F7;
margin: 20px 0 40px 0;
padding: 10px;
border: 1px solid #E6E6E6;
overflow: auto;
}

.author-box p {
margin: 0;
padding: 0;
}

.author-box img {
background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 4px;
border: 1px solid #E6E6E6;
}

]]></b:skin>

3. Then, search for <div class='post-footer-line post-footer-line-1'>. Immediately after that, paste the code below.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='author-box'>
<p><img alt='' class='avatar avatar-70 photo' height='70' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiB1t_B0oie1ybpxQ3iwwm-DQ36ENwnyPiX9BHpWx6xxI8aj0yyp0yc_fAzmJWK7IYen4x7Y3ttNdxOLLsDja1eSsfEgEJWU3uZGOdguNkgnIVDpHPUpv0kCsn0VXQJh9E7IaH45E4ieI-8/' width='70'/><b>About Author</b><br/>
Write anything about you here!<br/></p>
</div>
</b:if>

4. Click "Save" and done.

<b:if cond='data:blog.pageType == &quot;item&quot;'>....</b:if> is to make sure that the box is only visible in post pages and won't appear in Home Page. If you want to show your own image, just replace the default image source shown in green colour text in the code with your IMAGE URL.