How to Add Customized Author Box Widget on Blogger

Identify your self to enable visitors know you and everything about you this can make you more popular or you can get an opportunity for a job through that way.

Remember that when doing this you increase quality of your blog  and in this widget you can put or summarize who you are and what you can do.

Features are

• simple and professional
• Easy to set or customize
• it has high loading ability
• it fits any screen size

Now follow this steps below

How to add customized Author box widget  on Blogger

Step 1
Visit www.Blogger.Com and select the blog you want to do it on from the dashboard

Step 2
Click on Template >Edit HTML

Step 3
Look or search for this code below using control F (CTRL+F)


Step 4
Now just before the codes above in step 3 copy and paste this CSS codes below

.i-author {overflow:hidden;padding:.7em;background: #ECF7FF;}.i-author img {float:left;height:5.5em;padding:2px;margin: 0px 5px2.5em 0px;width:5.5em;border: 1px solidrgb(0, 4, 91) !important;border-radius:50%;}.i-author h4 {color: #000000;font-size:1.5em;margin:0px;padding: 0px 0px.5em 0px;}.i-author p {color: #434343;font-size:1em;line-height:1.7em;margin: 0;}.i-social{font-size:1.3em;margin-top:5px;}

Step 5

Now search for this

<divclass=’post-fotter-line post-footer-line-1’/>

Step 6
After that  just above the code copy and paste this code provided below

<!– author box –><div class=’i-author’><img alt=” src=’’/><h4>Yusuf bitrus</h4><p>Write something about yourself</p><div class=’i-social’>Follow me on: <a href=’’ rel=’nofollow’ target=’_blank’><font color=’#00aced’>Twitter</font></a> | <a href=’’ rel=’nofollow’ target=’_blank’><font color=’#3b5998′>Facebook</font></a> | <a href=’ no id’ rel=’nofollow’><font color=’#dd4b39′>Google Plus</font></a></div></div><!– author box end –>

Arrange it for your own blog

• replace the yellow URL with your profile image link

yusuf bitrus change it to your name

• write something about yourself  Remember identify yourself

• Replace all your social network Account url

Read Also  Whatsapp Widget: 4 Steps On How To Add WhatsApp Text Support To Your Website

Written by Yusuf Bitrus

I'm a Digi-Preneur, Affiliate Marketer, SEO intermediate and Blogger by heart.
I Help bloggers and business by writing and providing solutions digitally via my blogs, social media, and online/offline events.


Leave a Reply
  1. Howdy! I could have sworn I've been to this site before but after checking through some of the post
    I realized it's new to me. Nonetheless, I'm definitely delighted I found it and
    I'll be book-marking and checking back frequently!

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.