Friend, in this post i am going to share a blogger breaking new widget, we will add a new tool and easy, this tool you view the latest news blog in the form of a horizontal to suit the templates blogger. I hope you like it
Step to ad breaking news widget
Replace YOUR URL HERE with your site url past here.
5) Now Find the code </head> using [ctrl+F] (Use In HTML Box)
6) Now Paste the Code Shown Below just Before it.
7) Now save your template.
Step 2 : Add Widget to your blog
1) Go to Blogger Dashboard → Layout → Page Elements.
2) Add a HTML/JavaScript Gadget.
3) Paste below code in it.
5) Save your Widget.Don't forget to add the widget on the Center place.
You May Like Also
Also Like This
Step to ad breaking news widget
- Step 1 : Adding to Template
- 1) Loging Blogger.com and select your blog and then Go to Blogger Dashboard → Template → Edit HTML.
- 2) Now Find the code </body> using [ctrl+F] (Use In HTML Box)
- 3) Now Paste the Code Shown Below just Before it.
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
var url_blog = 'YOUR URL HERE', //replace with your Domain
numpostx = 10; //Posts want to display
$.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>');
}
});4) Customize your setting.Find any word click F3 or Ctrl+F.
});
//]]>
</script>
</b:if></b:if>
Replace YOUR URL HERE with your site url past here.
5) Now Find the code </head> using [ctrl+F] (Use In HTML Box)
6) Now Paste the Code Shown Below just Before it.
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style type='text/css'>
#beakingnews{width:980px;margin:0 auto;line-height:25px;height:25px;background:#F7F7F7;overflow:hidden;margin-top:5px;}
#beakingnews .tulisbreaking{display:block;float:left;padding:0 7px;margin:0 5px 0 0;color:#FCFCFC;background:#5F0000}
#recentpostbreaking{float:left}
#recentpostbreaking ul,#recentpostbreaking li{list-style:none;margin:0;padding:0}
</style>
</b:if></b:if>
7) Now save your template.
Step 2 : Add Widget to your blog
1) Go to Blogger Dashboard → Layout → Page Elements.
2) Add a HTML/JavaScript Gadget.
3) Paste below code in it.
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div id='beakingnews'><span class='tulisbreaking'>Breaking News</span><!-- tag pembuka tempat Breaking News-->
<div id='recentpostbreaking'>Loading...</div><!-- tag tempat daftar Breaking News ditampilkan-->
</div><!-- tag penutup tempat Breaking News-->
</b:if></b:if>
<div style='clear: both;'/>
5) Save your Widget.Don't forget to add the widget on the Center place.
1 Comments
Extremely well examined and well presented. And thank you for all.
ReplyDeleteFor know extra about blogging, visit bellow site
http://blogsnucleus.blogspot.com/