How to Add Customized Author Box Widget on Blogger

Follow me

Mathias Amodu

Founder at Zealmat Limited
2018 NIRA Award winner for Youth Development, A Web and SEO Specialist, Blogger, Student, Son, A business Man
Follow me
Identify your sell 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>Mathias Amodu</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=’’ rel=’nofollow’><font color=’#dd4b39′>Google Plus</font></a></div></div><!– author box end –>

Arrange it for your own blog

Also read  How To Add a Text Link To Blogger Comment

• replace the yellow URL with your profile image link

• Mathias Amodu change it to your name

• write something about yourself  Remember identify yourself

• Replace all your social network Account url

I hope that this tutorial. Nice and I hope you finally put the box

Don’t forget to Comment and subscribe

About Mathias Amodu 928 Articles
2018 NIRA Award winner for Youth Development, A Web and SEO Specialist, Blogger, Student, Son, A business Man


Leave a Reply

Your email address will not be published.