Monday, 18 March 2013
Add Author Box with Rotator Image Effects in Blogger Sidebar or Footer
how to Add Author Box with Rotator Image
Effects in Blogger Sidebaror Footer.
This author box contains rotator image effect
that means when your mouse cursor come on
image then it will rotate. I have tried to bring
little variety I include colored border your can
easily change color of border and other things.
This widgets Have great css effect.
How can you Add Author Box in bloggers blog?
- Log in to your blogger account.
- Click on blog title in which you want to add This Author box.
- Go to layout and then click on Add a Gadget.
- Select "HTML/JavaScript" Widget.
- Copy the below code and paste in it then Hit save.
<style>.KHprofileBorder {margin:5px auto;padding:10px;width:auto;
border-radius:5px;border: 2px #3322dd
solid;min-height:125px;
width:275px;}
#KHprofile{border:2px solid #888;
margin:2px 5px 0px 5px; padding:2px;
}
#KHprofile:hover {border:2px solid #ccc;cursor:pointer;
}
.KHprofileopacity {opacity: 0.5;margin-left: 50px;
-moz-transition: all 0.5s ease-out;
-o-transition:
all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out; -ms-transition:
all 0.5s ease-out;
transition: all 0.5s ease-out;
-moz-transform: rotate(8deg);
-o-transform: rotate(8deg);
-webkit-transform: rotate(8deg);
-ms-transform: rotate(7deg); transform: rotate(8deg);
sizingMethod='auto expand');
zoom: 1; }
.KHprofileopacity:hover {opacity: 1;
margin-left: 0px;-moz-transform:
rotate(0deg); -o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
sizingMethod='auto expand');
zoom: 1;
-moz-box-shadow: 1px 1px 4px #000;
-webkit-box-shadow: 2px 2px 8px #000;
box-shadow: 2px 2px 8px #000;} </style>
<div class="KHprofileBorder">
<img class="KHprofileopacity" id="KHprofile" height='65'
src="http://3.bp.blogspot.com/-61Gvbm5glB8/
UPpeVQAMZ1I/AAAAAAAAADM/oAOmgWv2GLI/s1600
/429379_242610719163393_2098735386_n.jpg "
width='50' align="left"/>I'm
<a rel="me" href=https://plus.google.com
/u/0/116054827022382240041/
title="Shakeel Asghar" target="_blank"> Shakeel Asghar
</a>from Lahore Pakistan. Founder of
<a href="http://kutebkhana.blogspot.com/">KutebKhana</a>
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.>>><a style="color:red;
"href="http://kutebkhana.blogspot.com/p/blog-
page.html " target="_blank">Read More »</a>
</div></div>
Customization!
- Change 116054827022382240041
with your G+ ID and write your own information.
- Change http://kutebkhana.blogspot.com/p/blog-page.html
link with your About Us Page.
- Change http://3.bp.blogspot.com/-61Gvbm5glB8
/UPpeVQAMZ1I/AAAAAAAAADM/oAOmgWv2GLI/s1600
/429379_242610719163393_2098735386_n.jpg
with your Image link. - If you want to change height and width of
width then simply change for
height
125px For width 275px.
Enjoy You Are Done!
Shakeel Asghar 
Posted By: Shakeel Asghar
Shakeel Asghar is the owner and founder of kutebkhana.blogspot.com. I love to blogging, Design Blogger template, Web Developing and Designing.i like to learn and share tips with you.
|
|
|
|
Get Free Email Updates Daily! |
Follow us! 
|
Subscribe to:
Post Comments (Atom)
I'm 
9 Responses to “Add Author Box with Rotator Image Effects in Blogger Sidebar or Footer”
20 March 2013 at 14:08
Hello, your google adsense will disabled in 1-2 month because you have not permission to add adsense in popup box in your blog. it's against of google adsense Terms and Conditions i just inform you otherwise as you wish
for more visit this link : http://www.google.com/help/nopopupads.html
http://www.makingdifferent.com
20 March 2013 at 15:24
Good Work Bro if you want a free domain for your website contact me http://facebook.com/wiz.arii
20 March 2013 at 16:20
@ nitin mehta
Brother thanks for inform me
20 March 2013 at 16:22
@ Ali Bajwa
thanks for your appreciation keep visiting for more tricks
31 March 2013 at 00:33
ThanQ dear.. it very Great full for me
2 April 2013 at 15:59
Really this was an awesome way to add Author Box Blogger Widget for the new blogger. It must be very easy to use any of the blog. Thanks for the sharing this useful things.
2 April 2013 at 17:17
@ shanta dsuza
you are always welcome buddy enjoy happy blogging!
1 May 2013 at 07:56
Very nice article thanks for sharing.
www.smartwebtricks.com
1 May 2013 at 22:16
@ ady bobs
thanks for your nice commenting
Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.
Note:
1. Make sure to click the "Subscribe By Email" link below the comment to be notified of follow up comments and replies.
2. Please "Do Not Spam" - Spam comments will be deleted immediately upon our review.
3. If you have a problem check first the comments, maybe you will find the solution there.
Regards,
Shakeel Asghar