How To Add Author's Profile Picture Below Post In Blogger

Having a problem on how to add your (author) profile picture beside the line "Posted By"in your Blogger blog? You are not wrong in landing this page since I will tell you you the details on how to do that. Just follow the four steps below.

NOTE:

This tutorial will not take effect if you unchecked your blog post to have a "Posted By". See the screenshot shot below to know what I mean.

Adding Author's Profile Picture Below Post In Blogspot

Step 1. Go to Blogger Dashboard >> Template >> Edit HTML (Back-up your Template)

Step 2. Find the code below using the Control F. Please select the second occurrence of that code.

<div class='post-footer-line post-footer-line-1'>

Step 3. After finding the code in step 2, please paste the code below just after it.

<b:if cond="data:post.author == &quot; Cerwenlloyd Gefjun&quot;">
<span class="author"><a href="https://plus.google.com/110772451841046895789/about"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidtVfdF2WUTe35J2t2ybeOCkAVE_Cn47-bIsSQQXKR67T8Z789fitM5zVrQUHe8btN2aWgizDKEgT4d5k_Y5to1ic0JwPLW6VAzQDO71gr96xRl82NMhJxBf3FGmLm7Zxz2e35ofx6Iy8/s1600/cerwen+profile+pic.png" style="border: 1px solid #d0d0d0; height: 28px; margin-top: -12px; margin-bottom: 0px; margin-right: -13px; padding: 2px; width: 28px;" /></a></span></b:if>

Customization:

• Replace the red bold text with your own profile name. It must be the EXACT name of your profile name  as it appears in the Blogger profile.


• Replace the orange bold texts with your Google  plus profile ID.


• Replace the pink bold texts with your image URL. Click here for help in getting your  image link.


• And lastly adjust the css which is responsible of the appearance of picture.

         border size and color- increase in number will make your border bigger also.
         height- this your image size
        margin- I set it with top 10px, bottom 0, and right 13px
        padding- which set by 2px
        width- this is the image width

Step 4. Save your Template and you're done. If you have some questions regarding this post , try to drop some comments at the comment box below.

Enjoy your day!