Holly Nicole
New member
- Joined
- Feb 22, 2013
- Messages
- 302
- Points
- 0
Step 1:
Go to your template and edit HTML then look for ]]></b:skin> and paste this just above
Now Search for
And place just After
REPLACE ALL THE COLORED MARKS WITH YOUR INFORMATION
Demo
Go to your template and edit HTML then look for ]]></b:skin> and paste this just above
Code:
#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;
}
Code:
<div class='post-footer-line post-footer-line-1'>
Code:
[COLOR=#000000][FONT=Courier New]<div id='author-box'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <div class='row row-1'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <div class='avatar'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <a href='[COLOR=#CC0000][B]YOUR LINK HERE[/B][/COLOR]'><img alt='author-avatar' class='avatar avatar-90 photo' height='90' src='YOUR IMAGE HERE' width='90'/></a>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </div>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <div class='info'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <h6>Posted By: [COLOR=blue][B]Hemant Verma [/B][/COLOR]<span>Admin and Author</span></h6>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <p><strong><a href='[COLOR=#CC0000][B]#[/B][/COLOR]'>[B][COLOR=purple][I]Marci[/I][/COLOR][/B] </a>[COLOR=purple][I] [B]is the founder of Vampire Marci</strong>[/B][/I][/COLOR]</p>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </div>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <div class='clear'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </div>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <div class='row row-2'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <a class='social-item website' href='http://#' meta='website' target='_blank'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='icon'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='label'>Website</span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='click'><span class='val'>113576 Visitors</span> </span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </a>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <a class='social-item twitter' href='https://twitter.com/#' meta='twitter' target='_blank'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='icon'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='label'>Twitter</span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='click'><span class='val'>200 Followers</span></span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </a>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <a class='social-item facebook' href='http://www.facebook.com/#' meta='face' target='_blank'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='icon'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='label'>Facebook</span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='click'><span class='val'>500 Likes</span></span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </a>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <a class='social-item gplus' href='#' meta='gplus' target='_blank'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='icon'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='label'>Google+</span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='click'><span class='val'>70 Joined</span></span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </a>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <a class='social-item linkedin' href='http://ph.linkedin.com/#' meta='linkedin' target='_blank'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='icon'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='label'>LinkedIn</span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='click'><span class='val'>40 Links</span></span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </a>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <a class='social-item youtube' href='https://www.youtube.com/user/#' meta='youtube' target='_blank'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='icon'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='label'>Youtube</span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <span class='click'><span class='val'>30 Followers</span></span>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </a>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <div class='clear'/></div>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <div class='row row-3'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <form action='https://www.paypal.com/cgi-bin/webscr' class='author-donation' method='post'>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <input name='cmd' type='hidden' value='_donations'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <input name='business' type='hidden' value='#'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <input name='lc' type='hidden' value='US'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <input name='item_name' type='hidden' value='Donate Blogger'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <input name='no_note' type='hidden' value='0'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <input name='currency_code' type='hidden' value='USD'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] <input class='donation-button' name='submit' type='submit' value='+Donate to Author'/>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </form><a class='register-button' href='http://blogger.com/'>Become a Blogger</a><div class='clear'/></div>[/FONT][/COLOR]
[COLOR=#000000][FONT=Courier New] </div>[/FONT][/COLOR][COLOR=#000000][FONT=Arial]
[/FONT][/COLOR]
Demo