I recently Posted a cool twitter follower widget for blogger blog. Previous one is a simple widget for sidebar.Today I’ve Floating Recent Tweets Widget For Blogger and WordPress Blog. When you move cursor on it. It pop out with Cool Floating Recent Tweets Widget. This is a great widget for you to increase twitter followers and force visitors to follow you. ![]()
Below I’ll show you how to add this Cool Floating Recent Tweets Widget In Blogger and WordPress.
Live Demo
Adding Cool Floating Floating Recent Tweets Widget.
Adding Recent Tweets Widget To Blogger
- Go to Dashboard > Design > Page Elements.
- Click Add A Gadget. In window, select HTML/Javascript .
- Copy the code below and paste it inside the box.
- Click Save button.
Adding Recent Tweets Widget To WordPress
- Go to Dashboard > Appearance > Widgets > Available Widgets.
- Drag Text widget into a sidebar.
- Paste in the code.
- Save.
<style>img,a{border:0;}#on{visibility:visible;}#off{visibility:hidden;}#facebook_div{width:196px;height:353px;overflow:hidden;}#twitter_div{width:246px;height:353px;overflow:hidden;}#google_plus_div{width:152px;height:97px;overflow:hidden;margin-left:50px;margin-top:10px;}#knfeedburner_div{width:300px;height:97px;margin-top:25px;overflow:hidden;}#kakinetwork_div{width:300px;height:97px;overflow:hidden;}
#twitter_right{z-index:10004;border:2px solid #6CC5FF;background-color:#6CC5FF;width:246px;height:353px;position:fixed;right:-250px;}#twitter_right_img{position:absolute;top:-2px;left:-35px;border:0;}
#kakinetwork_right{z-index:10003;border:2px solid #303030;background-color:#fff;width:300px;height:97px;position:fixed;}#kakinetwork_right img{position:absolute;top:-2px;left:-101px;}/* left side style */#facebook_left{z-index:10005;border:2px solid #3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;left:-200px;}#facebook_left img{position:absolute;top:-2px;right:-35px;}#facebook_left iframe{border:0px solid #3c95d9;overflow:hidden;position:static;height:360px;right:-2px;top:-3px;}#twitter_left{z-index:10004;border:2px solid #6CC5FF;background-color:#6CC5FF;width:246px;height:353px;position:fixed;left:-250px;}#twitter_left_img{position:absolute;top:-2px;right:-35px;border:0;}
#kakinetwork_left{z-index:10003;border:2px solid #303030;background-
color:#fff;width:300px;height:97px;position:fixed;}#kakinetwork_left img{position:absolute;top:-2px;right:-101px;}
</style><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script><script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script><script type="text/javascript">jQuery(document).ready(function(){ jQuery("#facebook_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#facebook_right").stop(true,false).animate({right: -200}, 500); }); jQuery("#twitter_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#twitter_right").stop(true,false).animate({right: -250}, 500); }); jQuery("#google_plus_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#google_plus_right").stop(true,false).animate({right: -154}, 500); }); jQuery("#feedburner_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#feedburner_right").stop(true,false).animate({right: -303}, 500); }); });</script>
<div id="on"><div id="twitter_right" style="top: 20%;"><div id="twitter_div"><img id="twitter_right_img" src="http://2.bp.blogspot.com/-fcEMbjMcVhI/UDzNfUCWxcI/AAAAAAAAAt4/p0lew_c7Sxw/s320/allbloggingtips.com-twitter-icon.png" /><script src="http://widgets.twimg.com/j/2/widget.js"></script><script>new TWTR.Widget({version: 2,type: 'profile',rpp: 4,interval: 1000,width: 246,height: 260,theme: {shell: {background: '#63BEFD',color: '#FFFFFF'},tweets: {background: '#FFFFFF',color: '#000000',links: '#47a61e'}},features: { loop: false,live: true,scrollbar: false,hashtags: false,timestamp: true,avatars: true,behavior: 'all' }}).render().setUser('allbloggingtips').start();</script></div></div></div>
</div>
Just replace allbloggingtips with your twitter username. That’s it!
Visit your Blogs to see it floating at the right side of your webpage. I hope this Floating Recent Tweets Widget will help you in increasing the number of your Twitter Followers. That’s all. If you face any problem in Floating Floating Recent Tweets Widget then don’t stop just drop your comments and Feel free to ask.
Did you enjoy this article?
|
Subscribe via Email!
Get Freebies, updates & Special offers straight into your inbox.
|






Become guest author and get backlinks, free traffic and exposure
{ 27 comments… read them below or add one }
awesome bro………
This is so cool! I am gonna put it on my blog.
Check it out later!
Thanks for this one!
No doubt this is one of the awesome widget for Twitter, Thanks For Sharing
Haider recently posted..Top 7 Strategies To Rank Well For Keywords In Your City
How can i add this to wordpress???
Thank you
DannyelPicazo recently posted..~ Feria Mineral De La Reforma 2012
Hello There!
I’ve update this tutorial with new code and steps. Please look again!
Cool, thank you very much!!!
I just see there is a facebook version, it works in wordpress to???
I’m not sure! Can I get more details please?
This widget but for wordpress http://allbloggingtips.com/2012/01/25/add-stylish-floating-facebook-like-box-widget-in-blogger/
Thanks a lot for such helpful posts Ammar.
Khaja moin recently posted..35 Social Bookmarking Sites to Increase Your Traffic
It’s awesome bro. Very clean and neat. :Thumbs up:
Pavan recently posted..How You Can Increase Comments On Your Blog
Cool work Ali.This will come handy in few of my blogs.Looking forward to some more awesome works
Kudos!!
Vinod Kumar recently posted..All About Plastation Network Codes
Looks Cool As Shown In Image


Good Work Ammar
Osho Garg recently posted..How To Add Black & White Facebook Like Box v3 To Blogger
nice widget thanks buddy keep up the good work….
JZEEK recently posted..HTC J ISW13HT waterproof Smartphone
Amazing. Does it increase the page load time. Have you done all this coding yourself.
Not! It wont affect your blog loading time. YES!
Hey,
Thank you for this awesome twitter widget. I was looking for this.
Thank you
Saif
Saif recently posted..Categories Vs Tags – What to choose from SEO perspective ?
Super cool widget. Will definitely try this. Thanks mate.
Kate Simpson recently posted..Eva Longoria HD Wallpapers
Awesome widget brother Ammar. I will definitely put it in my blog.
Thanks for the share.Peace.
Usama Siddiqui recently posted..Get .asia Domain For Free
Thanks a lot for sharing this. Keep it up Ammar. I need this on my blog.
CHRISTIAN LITERATUS recently posted..Finest Waterfall in Cebu – Mantayupan Falls
Thanks lotzzzz Ammar, Am going to use in my blog.
jaswanth recently posted..What is Hibernate – Hibernate Introduction
Very cool – just one question.
There is a random greyed out box that is now in the sidebar that doesn’t look like it should be there. Any idea on how to get rid of it?
Thanks!
you can’t remove this!
Its a cool Tools for blogs recent tweets neat to see it in blogs
can i use this plugin with the facebook plugin ??
krishnaTORQUE recently posted..By: krishnaTORQUE
sure, you can!
If you are looking for that floating like box for WP. Here is tutorial http://allbloggingtips.com/2012/05/11/floating-facebook-like-box-for-wordpress/
facebook like box is just amazing.
i am about to add it, i think i love it.
Thanks a lot bro

Virendra recently posted..Rail Budget 2013 Highlights – Indian Rail Budget 2013