Automated Latest Posts News Ticker for Blogger

Latest Posts Ticker Blogger
Today I will show how you can add Automated Latest Posts News Ticker to your blogger blog. WordPress blogs can add these things easily by uploading the plugins but in blogger we have to manually add code for it. So this widget will show the 10 [can be increased or decreased] latest posts of your blog in a ticker box.

This ticker is fully automated and you just have to add URL of your blog and it will update the new posts automatically. The live demo of this widget can be seen by clicking the below Live demo button. This ticker will be below the two navigation bars.



Once you have seen the demo we can move on with the instructions of how you can add this news ticker to your blogger blog.

Editing HTML of your blog


First go to Blog Title → Template → Edit HTML. Press Ctrl + F and search for  <div id='content-wrapper'> and add the given code just above it.

Or

Adding The Widget in the Blog:

STEP 1: Log in to your Blogger account and Go to your Blogger Dashboard


Blogger Layout

STEP 2: In The Left Side Bar You will find Layout Section as highlighted in the image above Click on Layout.


Add a Gadget


STEP 3: Click On "Add a Gadget" As highlighted in the image above.

HTML Script Section Screenshot


STEP 4: After Clicking on "Add a Gadget" Choose "HTML/JavaScript" from the list & as highlighted in the image above.


STEP 5:  Now Copy This Below Code And Paste it in The Empty Box of the "HTML/JavaScript" Section.

<div style="width:970px;height:20px;position:relative;">
<script type="text/javascript">
var blog_url = "http://www.allbloggertricks.com";
var latest_post = 10;
var scrolling_speed = "8";
var close_button = false;
var info_text = true;
</script>
<script src="http://files.allbloggertricks.com/abt-ticker.js"></script>
</div>
<br />
<br />
<div style='clear:both;'/>

Settings


Change  the following according to your needs -

var blog_url - Add your blog URL by replacing http://www.allbloggertricks.com
var latest_post - The number of posts link you want to have in the ticker
var scrolling_speed - Increase/Decrease the number to increase/decrease scrolling speed.
var close_button - If you want to add close button in the ticker
var info_text - If you want to remove/keep the text "Latest Articles" and RSS icon.

After making the changes save the template.

You are done now. Now you and your visitors can see this Automated Latest Posts News Ticker in your blogger blog.