Earlier i have posted the facebook widget to bloggers ‘Add static facebook pop out like box with smooth jquery hover effect’ now it time to the twitter.Now get this new twitter followers box with the image thumbnails works on the smooth static jquery hover effect
Follow these steps to add this widget successfully to your blogger
Part1
Jquery plugin
1.Go to blogger –>> Design or Template –>> Edit html
2.Back up your template
3.Search for the code </head> by using shortcut key ctrl+f
4.Add below code just above </head>
5.Save template.
Part2
Html code
1.Go to blogger->> Page elements or Layout –>> Add a Gadget->> Html/java script.
2.Add the below code in the Html/java script box.
3.Change modifymyblogs to your twitter username.
Follow these steps to add this widget successfully to your blogger
Part1
Jquery plugin
1.Go to blogger –>> Design or Template –>> Edit html
2.Back up your template
3.Search for the code </head> by using shortcut key ctrl+f
4.Add below code just above </head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"
type=
"text/javascript"
></script>
Part2
Html code
1.Go to blogger->> Page elements or Layout –>> Add a Gadget->> Html/java script.
2.Add the below code in the Html/java script box.
<script type=
"text/javascript"
>
//<!--
$(document).ready(function() {$(
".twitterboxot"
).hover(function() {$(this).stop().animate({
right
:
"0"
},
"medium"
);}, function() {$(this).stop().animate({
right
:
"-250"
},
"medium"
);},
500
);});
//-->
</script>
<style type=
"text/css"
>
.twitterboxot{
background
:
url
(
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgca9Hqn1S4B5Ivxv6dAdNamb42XxhY7PScUQvI5EGaI7nhNlkhsz6meW147Fgil9dTLXpRqtuEe1htYx3ZP9BSd_0YMwMqDTM_FJtCFEFLr5FrFFlDgdNkiXph1E7gfOUKOcI0QmL3OQw/s1600/twitterfanbox-OT.png"
)
no-repeat
scroll
left
center
transparent
!important
;
display
:
block
;
float
:
right
;
height
:
240px
;
padding
:
0
5px
0
46px
;
width
:
245px
;
z-index
:
99999
;
position
:
fixed
;
right
:
-250px
;
top
:
20%
;}
</style>
<div class=
"twitterboxot"
><div>
<script type=
"text/javascript"
src=
"http://script-ot.googlecode.com/svn/twitterbox.js"
></script><div
id=
"twitterfanbox"
></div><script
type=
"text/javascript"
>fanbox_init(
"modifymyblogs"
);</script>
<span class="author-credit" style="font-family: Arial, Helvetica, sans-serif;"><a href="http://modifymyblogs.blogspot.com/2012/01/add-both-twitter-and-facebook-jquery.html" target="_blank" >Blogger Widgets »</a></span></div></div>
i have the two of them and the one is above the other ...how can i put them in different sides of the page???? please help...
ReplyDeletesoon ,i will post a post on it
DeleteYou Have Nice Widget.
ReplyDeleteI Have Also Facebook, Twitter, Google Plus, Subscribe, YouTube J-Query PoP Out Widget For Blog & Website. Check Out This...
Not work for blogger
ReplyDelete