Professional eRose Author Bio Widget
See Also: Advance Author Box Widget For Blogger
- Login to Blogger → Dashborad
- Click on Drop Down Menu and select Template
- Backup your Template before making any changes to your blog
- Press Ctrl + F and search the code shown below.
]]></b:skin>
Paste below code just above it.
.clear {clear:both;}#author-box {margin:10px 0;}#author-box a:hover {background:none!important;}#author-box .row-1 {background:#333;padding:20px;}#author-box .row-1 .avatar {float:left;line-height:1;-moz-box-shadow:0 0 10px #FFF;-webkit-box-shadow:0 0 10px #FFF;box-shadow:0 0 10px #FFF;}#author-box .row-1 .info {margin:0 0 0 110px;}#author-box .row-1 .info h6 {color:#FFF;font-size:20px;margin:-4px 0 0;}#author-box .row-1 .info h6 span {font-size:11px;font-weight:400;background:#1BA1E2;-webkit-border-radius:40px;-moz-border-radius:40px;border-radius:40px;filter:alpha(opacity=60);opacity:0.6;margin:0 0 0 1em;padding:1px 9px 2px;}#author-box .row-1 .info p {color:#DDD;font-weight:400;font-size:14px;margin:0;}#author-box .row-2 {background:#666;}#author-box .row-2 a.social-item {display:block;float:left;color:#FFF;text-align:center;padding:15px;}#author-box .row-2 .social-item .icon {height:32px;width:32px;}#author-box .row-2 .social-item > span {display:block;text-align:center;margin:auto;}#author-box .row-2 .social-item .label {font-weight:700;font-size:13px;}#author-box .row-2 .social-item .click {font-size:11px;color:#EAEAEA;line-height:1;}#author-box .row-2 a.social-item:hover {background:#1BA1E2!important;}#author-box .row-3 {background:#1BA1E2;}#author-box .row-3 form,#author-box .row-3 a.donation-button {display:block;float:left;}#author-box .row-3 .donation-button {background:#1BA1E2;border:none;font-family:Impact;font-size:30px;color:#FFF;line-height:1.2em;margin:0;padding:10px;}#author-box .row-3 .donation-button:hover {background:#000;cursor:pointer;}#author-box .row-3 .register-button {display:block;color:#FFF;border:none;font-family:Impact;font-size:30px;text-align:right;line-height:1.2em;margin:0;padding:10px;}#author-box .row-3 .register-button:hover {color:#000;cursor:pointer;}#author-box .row-2 .social-item.twitter .icon {background-position:0 -32px;}#author-box .row-2 .social-item.facebook .icon {background-position:0 -64px;}#author-box .row-2 .social-item.gplus .icon {background-position:0 -96px;}#author-box .row-2 .social-item.linkedin .icon {background-position:0 -128px;}#author-box .row-2 .social-item.youtube .icon {background-position:0 -160px;}#author-box .row-2 .social-item.pinterest .icon {background-position:0 -192px;}#author-box .social-item .icon {background-image:url(https://lh5.googleusercontent.com/--PQVoN23nrI/UYHHvhtNSxI/AAAAAAAAJPA/5weO87qvER4/s224/ausocial.png)!important;background-repeat:no-repeat;}
Now Search for below code once again
<div class='post-footer-line post-footer-line-1'>
Paste below code just after it.
<div id='author-box'> <div class='row row-1'> <div class='avatar'> <a href='http://mix--er.blogspot.com/2015/03/author-bio-widget.html'><img alt='author-avatar' class='avatar avatar-90 photo' height='90' src='http://lh5.googleusercontent.com/-9ovzX6EzHt0/AAAAAAAAAAI/AAAAAAAAA_0/0yCHqDhLbEM/s80-c/photo.jpg' width='90'/></a> </div> <div class='info'> <h6>Posted By: Autor (Your Name) <span>Admin and Author</span></h6><p><strong><a href='http://mix--er.blogspot.com/2015/03/author-bio-widget.html'>Ana </a> is Blogger Girl, one of many in the world.</strong> <strong>Graduate in Computer Applications, Love to Make Blogger Hacks and Like to Play with HTML and a Business Woman.</strong></p> </div> <div class='clear'/> </div> <div class='row row-2'> <a class='social-item website' href='http://mix--er.blogspot.com/' meta='website' target='_blank'> <span class='icon'/> <span class='label'>Website</span> <span class='click'><span class='val'>113576 Visitors</span> </span> </a> <a class='social-item twitter' href='https://twitter.com/YourURL' meta='twitter' target='_blank'> <span class='icon'/> <span class='label'>Twitter</span> <span class='click'><span class='val'>200 Followers</span></span> </a> <a class='social-item facebook' href='http://www.facebook.com/blogossphere' meta='face' target='_blank'> <span class='icon'/> <span class='label'>Facebook</span> <span class='click'><span class='val'>500 Likes</span></span> </a> <a class='social-item gplus' href='https://plus.google.com/+SweettSixteenn-kiss' meta='gplus' target='_blank'> <span class='icon'/> <span class='label'>Google+</span> <span class='click'><span class='val'>70 Joined</span></span> </a>
<a class='social-item linkedin' href='http://ph.linkedin.com/YourName' meta='linkedin' target='_blank'> <span class='icon'/> <span class='label'>LinkedIn</span> <span class='click'><span class='val'>40 Links</span></span> </a> <a class='social-item youtube' href='https://www.youtube.com/user/YourURL' meta='youtube' target='_blank'> <span class='icon'/> <span class='label'>Youtube</span> <span class='click'><span class='val'>30 Followers</span></span> </a>
<div class='clear'/></div> <div class='row row-3'> <form action='https://www.paypal.com/cgi-bin/webscr' class='author-donation' method='post'> <input name='cmd' type='hidden' value='_donations'/><input name='business' type='hidden' value='yourmail@gmail.com'/> <input name='lc' type='hidden' value='US'/> <input name='item_name' type='hidden' value='Donate Blogger'/> <input name='no_note' type='hidden' value='0'/> <input name='currency_code' type='hidden' value='USD'/> <input class='donation-button' name='submit' type='submit' value='+Donate to Author'/> </form><a class='register-button' href='http://blogger.com/'>Become a Blogger</a><div class='clear'/></div> </div>
Replace this
- http://mix--er.blogspot.com/2015/03/author-bio-widget.html with your author bio page link (Optional)
- Replace this http://lh5.googleusercontent.com/-9ovzX6EzHt0/AAAAAAAAAAI/AAAAAAAAA_0/0yCHqDhLbEM/s80-c/photo.jpg with your author image.
- Replace this Autor (Your Name) with your Author OR Admin name.
- Replace this Ana with your author bio.
- Replace this www.widgetgenerators.com with your website link.
- Replace this https://twitter.com/YourURL with your twitter username.
- Replace this blogossphere with your Facebook username.
- Replace this +SweettSixteenn-kiss with your Google Plus id
- Replace this YourName with your linked in profile id.
- Replace this https://www.youtube.com/user/YourURL with youtube username.
- Replace this yourmail@gmail.com with your email id on Paypal account
- Finally Save your Template.
- You are done