Also Read

How To Add Breaking NEWS Ticker In Blogger?

Breaking News Ticker gadget for bloggers is a powerful gadget for drawing in visitors attraction and increase the quantity of your site. In this article you will come to know how to add breaking NEWS ticker in blogger.

What Is A Breaking News Ticker For Blogger?

Breaking News Ticker gadget permits you to effectively add the latest news from any source as a live ticker into your sidebar or top of the header.

Breaking News Ticker gadgets are ideal for when you need to show making it known stories on your site. They are perfect for any page in your blog.

Breaking News Ticker gadgets really convey recent category right to the people that are most interested in finding out more.

 

Features Of Breaking News Ticker

• Simple to utilize and introduce.
• Introduce in the header, sidebar, and between any post.
• Show the most recent and most established post with title and picture.
• You can involve it in your format design area.
• Show your post quicker and more straightforward.
• Advance level coding.
• Exceptional looks from another ticker gadget.
• Extraordinary search in dim mode and light mode.
• It shows many posts.
• You can change foundation, variety, and text style.

How Do I Add Breaking NEWS Ticker In Blogger?

Step 1: 

Go to blogger dashboard.

Step 2: 

Then Theme > Edit HTML.

Step 3: 

Click anywhere into the code field.

Step 4: 

Press Ctrl + F and search for </style>.

Step 5: 

Now copy the below code and paste it above </style>.

#beakingnews{width:980px;margin:0 auto;line-height:35px;height:35px;background:#F7F7F7;overflow:hidden;margin-top:5px;} #beakingnews .tulisbreaking{display:block;float:left;padding:0 7px;margin:0 5px 0 0;color:#FFF;background:#FD1515} #recentpostbreaking{float:left} #recentpostbreaking ul,#recentpostbreaking li{list-style:none;margin:0;padding:0}

Step 6: 

Again search for </body>

Step 7: 

Now copy the below code and paste it above </body>.

<script type='text/javascript'>//<![CDATA[ $(document).ready(function () { var url_blog = 'Your blog URL Here', numpostx = 10; $.ajax({ url: '' + url_blog + '/feeds/posts/default?alt=json-in-script&max-results=' + numpostx + '', type: 'get', dataType: "jsonp", success: function(data) { var posturl, posttitle, skeleton = '', entry = data.feed.entry; if (entry !== undefined) { skeleton = "<ul>"; for (var i = 0; i < entry.length; i++) { for (var j=0; j < entry[i].link.length; j++) { if (entry[i].link[j].rel == "alternate") { posturl = entry[i].link[j].href; break; } } posttitle = entry[i].title.$t; skeleton += '<li><a href="' + posturl + '" target="_blank">' + posttitle + '</a></li>'; } skeleton += '</ul>'; $('#recentpostbreaking').html(skeleton); // kode untuk efek pada breaking news function tick(){ $('#recentpostbreaking li:first').slideUp( function () { $(this).appendTo($('#recentpostbreaking ul')).slideDown(); }); } setInterval(function(){ tick () }, 5000); } else { $('#recentpostbreaking').html('<span>No result!</span>'); } }, error: function() { $('#recentpostbreaking').html('<strong>Error Loading Feed!</strong>'); } }); }); //]]></script>

Customize the code:

1. Change your blog name 'Your blog URL Here'

2. Change your URL 'Your blog URL Here' 

3. Change the number of posts numpostx  = 10

"10" Change with how many Posts want to Display

Step 8: 

Now save the theme.

Step 9: 

Go to blogger Layout > Add a Gadget > HTML/JavaScript.

Step 10: 

Copy the below code and paste it into the content area.

<div id='beakingnews'><span class='tulisbreaking'>Breaking News:</span><div id='recentpostbreaking'>Loading...</div></div><div style='clear: both;'/>

Step 11: 

Save the gadget.

You are done.

Conclusion

Hope you have successfully added these codes on your blog. If you like this way to add a beautiful breaking news ticker in blogger, please share it to your friends.