Scrolling News Update Headline Ticker For Blogger With Jquery Effect

A News Ticker is becoming the basic requirement of every blog. To make our blogging community more reliable it is essential that we keep our readers up to date and News Ticker is the best way of doing that. We can use the News Ticker to give frequent updates to our reader in just few clicks. We all have seen many news tickers in those blogs which are hosted by WordPress but Blogger is not knows for its plugins this is the reason why we use external source widgets in blogger. And today we will follow the same trend to add a Animated Scrolling JQuery News Ticker Widget in Blogger Blogspot Blogs.


To insert Scrolling JQuery News Ticker in Blogger Follow these Steps.
1: Go to Blogger.com -> Your Blog
2: Layout -> Add a Gadget
3: Add Html/Javascript and just Paste the following code

    <div id="TICKER" style="display:none; border-top:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; overflow:hidden; background-color:#FFFFFF; width:520px" onmouseover="TICKER_PAUSED=true" onmouseout="TICKER_PAUSED=false">
    <span style='background-color:#7FB51A;'> &nbsp; &nbsp;<a href="Your-First-Headline-Url-Here"> <font color=#ffffff> <b>Your-First-Headline-Title-Here</b></font>&nbsp; &nbsp; </a></span> &nbsp; <b>Your-First Headline-Description</b>&nbsp;
    <span style='background-color:#FFAA00;'> &nbsp; &nbsp;<a href="Your-Second-Headline-Url-Here"> <font color=#ffffff> <b>Your-Second-Headline-Title-Here</b></font>&nbsp; &nbsp; </a></span> &nbsp; <b>Your-Second-Headline-Description-Here</b>&nbsp;
    <span style='background-color:#0088FF;'> &nbsp; &nbsp; <b><a href="Your-Third-Headline-Url-Here"><font color=#ffffff>Your-Third-Headline-Title-Here</font></a></b>&nbsp; &nbsp; </span> &nbsp; <b>Your-Third-Headline-Description-Here</b>&nbsp; 
    <script type="text/javascript" src="http://mybloggerlab.com/Scripts/webticker_lib.js" language="javascript"></script></b></span></div>
    </b:if></b:if>

Remember: If you want to add more Headlines in your ticker then just before <script type="text/javascript" Add the following code and this will add one more headline in your ticker.

    <span style='background-color:#7FB51A;'> &nbsp; &nbsp;<a href="Your-Headline-Url-Here"> <font color=#ffffff> <b>Your-Headline-Title-Here</b></font>&nbsp; &nbsp; </a></span> &nbsp; <b>Your-Headline-Description</b>&nbsp;