Go to your Blogger
Template > Edit HTML
Now Find this code ]]></b:skin> (ctrl+f)
Paste the below code Before/above ]]></b:skin> and Save the templates.
]]></b:skin>
Author Box 1
/* Author Box by www.Thetrickslab.blogspot.com */
.admin-bs{display:block; width:auto; background:#F5F5F5; border:3px solid #C0C0C0; box-shadow:0 1px 3px #000; -moz-box-shadow:0 1px 3px #000; -webkit-box-shadow:0 1px 3px #000; padding:0; margin:30px 0 10px 0; font:normal 12px Arial,Sans-Serif; color:#222}
.admin-bs .kontainer{padding:5px}
.admin-bs h1{background:#C0C0C0; border:none; border-bottom:1px solid #C0C0C0; color:#fff; text-transform:normal; text-shadow:0 1px 0 rgba(0,0,0,0.4); font:bold 12px Arial,Sans-Serif; padding:5px 10px; margin:0 0 0 0; display:block}
.admin-bs h1 a{color:#FEEA83}
.admin-bs img{width:70px; height:70px; margin:0 10px 0 0; float:left; border:0px solid #E6E6FA; padding:2px; background:#E6E6FAbox-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none}
Author Box 2
/* Author Box by www.thetrickslab.blogspot.com */
.admin-bs{display:block; width:auto; background:#F5F5F5; border:3px solid #C0C0C0; box-shadow:0 1px 3px #000; -moz-box-shadow:0 1px 3px #000; -webkit-box-shadow:0 1px 3px #000; padding:0; margin:30px 0 10px 0; font:normal 12px Arial,Sans-Serif; color:#222}
.admin-bs .kontainer{padding:5px}
.admin-bs h1{background:#C0C0C0; border:none; border-bottom:1px solid #C0C0C0; color:#fff; text-transform:normal; text-shadow:0 1px 0 rgba(0,0,0,0.4); font:bold 12px Arial,Sans-Serif; padding:5px 10px; margin:0 0 0 0; display:block}
.admin-bs h1 a{color:#FEEA83}
.admin-bs img{width:70px; height:70px; margin:0 10px 0 0; float:left; border:0px solid #E6E6FA; padding:2px; background:#E6E6FAbox-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none}
Author Box 3
/* Author Box by www.thetrickslab.blogspot.com */
.admin-bs {display:block; width:auto; background:#FED9BF; border:5px solid #B24700; box-shadow:0 1px 3px #000; -moz-box-shadow:0 1px 3px #000; -webkit-box-shadow:0 1px 3px #000; padding:0; margin:30px 0 10px 0; font:normal 12px Arial,Sans-Serif; color:#222}
.admin-bs .kontainer{padding:5px}
.admin-bs h1{background:#00477D; border:none; border-bottom:1px solid #C0C0C0; color:#fff; text-transform:normal; text-shadow:0 1px 0 rgba(0,0,0,0.4); font:bold 12px Arial,Sans-Serif; padding:5px 10px; margin:0 0 0 0; display:block}
.admin-bs h1 a{color:#FEEA83}
.admin-bs img{width:70px; height:70px; margin:0 10px 0 0; float:left; border:0px solid #E6E6FA; padding:2px; background:#E6E6FAbox-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none}
Part now you have to go for HTML coding.
Template -> Edit HTML
Now find <data:post.body/>
by pressing Ctrl + F
You will find 3/4 time this code go for second one.
Now Copy the below code and Paste it before /above code
<div class="admin-bs">
<h1>Founded by : <a href="https://plus.google.com/u/0/117382748404876103459/posts">Asad tariq</a> - Written 50+ Awesome Articles </h1>
<div class="kontainer">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitMjWFcOrpCT-Lc0SiBYBpccARuJTQ4GxjkcjJGSCGH_-KYZxkuS-bgNJuMRR3cC9q1KyZcEb-9ER-GacSIUCgWEysag9-NhpwAn2RL4rlES1x6h043fZlFqVbsYVu6ExFh17IqFLbAKxG/s320/Untitled-1.jpg
" width="80" height="85"></img>
I love to blogging and sharing tips and tricks with my readers. I am a Part time blogger. Design Blogger template, Web Developing and Designing. If you think that this article help you little bit then please do not forget to subscribe by entering your email in column Get Updates Via Email.
<p><span style='float:left;text-align:left;'>
Join Me On: <a href='http://www.facebook.com/asadtariq786' rel='nofollow'>Facebook</a> | <a href='http://www.twitter.com/asadtariq78' rel='nofollow'>Twitter</a> | <a href='https://plus.google.com/117382748404876103459/' rel='nofollow'>Google Plus</a></span>
<span style="float:right;font:italic 10px Arial, Sans-Serif;"><a href="http://thetricklab.blogspot.com/2014/03/How-To-Add-Author-Info-Box-At-the-bottom-of-every-Blog-Post.htmll" target="_blank">:: Thank you for visiting ! ::</a></span></p>
<div style="clear:both;"></div>
And save template.
Change this link https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvFwKljQN1po51vHpk78GyzSlh_CmAHJzjU26540AdpY6ZFthTTg6kHGN2v_SxJAv7yka7tTVepKEXeGaxjG_y1zDAOgM0NEooJJ1z7PvZiPrrQRzen7HAHfwEGaiWHatcAvEZeDSflJbX/s1600/as.jpg with your image link.
Change Asadtariq786 Asadtariq78 with your Twitter and Facebook ID
Change 117382748404876103459 with your Google Plus ID
Post a Comment