jQuery Twitter Tweets Ticker For Blogger Blog

jQuery Twitter Tweets Ticker For Blogger Blog This widget is created by Tutorialzine This widget developed using jQuery and CSS and can be easily added to any blog or website. It shows some latest tweets (last 7 days) from your twitter account with a link to your account.This is a best widget to show off your recent tweets and as always I am providing a widget generator with more customizations options,with using this widget generator you can easily add it to your blogger blog without any tension of replacing usernames. :) Now lets see how to add it to your blog.First see the demo of the widget by clicking on the button below.

jQuery Twitter Ticker Demo

LIVE DEMO

How To Add jQuery Twitter Ticker to Blogger

• Go to Layout and select HTML/Javascript and paste the code shown below

<div id="twitter-ticker"><div id="top-bar"><div id="twitIcon"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhji2-gWehvSwNStxaGHcf4C_gCLYGQIojUHmibX94v4WD7c5_CnyzRBQSIylu7YhtMCjWssn0Q30es1aR2frhAKGnGhOwce85muqy2RyOw-yeLfhp9l6j4vBevHr6z7oYU3ueXMI2n0e8/s1600/twitter_64.png" width="64" height="64" alt="Twitter icon" /></div><h2 class="tut">My tweets</h2></div><div id="tweet-container"><img id="loading" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZnYpqndNw5EuX__wYFnamsVZ9MUpD9I1lB6DPW8CWQ3I1qR36MycH6WgZytBTIcAYW8jhGKfxAYNHHlK53t3gCk2BgyM5tB6vS5ia5XTKKsvC7x7vrhPqdSwR1rSPBt_aHig5mvBdS5U/s1600/loading.gif" width="16" height="11" alt="Loading.." /></div><div id="scroll"></div></div><style type="text/css">h2.tut{color:white;font-family:"Myriad Pro",Arial,Helvetica,sans-serif;font-size:16px;padding:12px 0 0 58px;text-transform:uppercase;text-shadow:2px 1px 6px #333}#twitter-ticker{width:300px;height:300px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5j3lVj8p0lGVethbYXw4ASZIuq91Z6pMltUCOjCOMf5Zh8klF6iQEWzSqYIx9NVB8u6TafTj5xO-fbU_EK3KnBy00W8xvAsyrz3U6-ku1qaSojryo0PnI_WqI9xCNZr3J1SHQYgk5YTo/s1600/slickbg.png) no-repeat #f5f5f5;color:#666;display:none;-moz-border-radius:10px 10px 6px 6px;-khtml-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;text-align:left}#tweet-container{height:300px;width:auto;overflow:hidden}#twitIcon{position:absolute;top:-25px;left:-10px;width:64px;height:64px}#top-bar{height:45px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3-ULfY33vsORJsXaF68kSzD2HzPLvkQkClhdehOBHnZkizvDzq9MmwsoA6mh4Tk_ameJlV8WSO3XDiBkc_gPiYViwvr3nv9SWoIt-qrPdA6NIaJPH469hG1qudEvbzJHmRIgb1YLp5jg/s1600/top_bar.png) repeat-x;border-bottom:1px solid white;position:relative;margin-bottom:8px;-moz-border-radius:6px 6px 0 0}.tweet{padding:5px;margin:0 8px 8px;border:1px solid #f0f0f0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9LdSHt-oHLI1qsEd5feKCEOZFcd7nZwr38lliryUwCn158AdVlkX_yveXl3Up-EVSqG6Az9f0EfzdmcImIyfc3ElXx_fK45YI8ToFer7Xduf8QdPfAu7irDg8Y-vV6JbtowGuE2O1D8k/s1600/transparent.png);width:auto;overflow:hidden}.tweet .avatar,.tweet .user,.tweet .time{float:left}.tweet .time{text-transform:uppercase;font-size:10px;color:#aaa;white-space:nowrap}.tweet .avatar img{width:36px;height:36px;border:2px solid #eee;margin:0 5px 5px 0}.tweet .txt{clear:both}.tweet .user{font-weight:bold}a,a:visited{color:#0bf;text-decoration:none;outline:0}a:hover{text-decoration:underline}#loading{margin:100px 95px}.jScrollPaneContainer{position:relative;overflow:hidden;z-index:1}.jScrollPaneTrack{position:absolute;cursor:pointer;right:4px;top:0;height:100%;background:#ddd}.jScrollPaneDrag{position:absolute;background:#999;cursor:pointer;overflow:hidden}.jScrollPaneDragTop{position:absolute;top:0;left:0;overflow:hidden}.jScrollPaneDragBottom{position:absolute;bottom:0;left:0;overflow:hidden}a.jScrollArrowUp{display:block;position:absolute;z-index:1;top:0;right:0;text-indent:-2000px;overflow:hidden;height:9px}a.jScrollArrowDown{display:block;position:absolute;z-index:1;bottom:0;right:0;text-indent:-2000px;overflow:hidden;height:9px}</style><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" src="http://js.howtouses.com/blogger/jquery.mousewheel.js"></script><script type="text/javascript" src="http://js.howtouses.com/blogger/jScrollPane-1.2.3.min.js"></script><script type="text/javascript" src="http://js.howtouses.com/blogger/script.js"></script><script type="text/javascript"> var tweetUsers = ['latesthack']; </script>

Replace latesthack with your twitter username

Like it? Share it.