Cara membuat breaking news di blog

Cara membuat breaking news di blog - Hai sobat blogger Master Copast kali ini akan posting kembali. Sesuai dengan judulnya di atas pasti sobat sudah tau apa itu breaking news, breaking news ini berfungsi sebagai pemberi tahu pengunjung yang mengunjungi blog kita bahwa ada artikel baru yang sudah di update oleh oleh admin blog tersebut. Jika sobat pengen tau bentuknya bagaimana lihat screenshoot di bawah ini sob :

Berminat sobat untuk membuatnya langsung saja ikuti langkah-langkahnya di bawah :

Pertama login ke blog sobat.
Selanjutnya download dulu templatenya, hal ini dilakukan untuk mengantisipasi bila terjadi kesalahan
Pada menu pilih Rancangan ➨ Edit HTML.
Pada Edit Template jangan lupa untuk mencentang Expand Template Widget,
Cari code ]]></b:skin>
Apa bila sudah ketemu sobat copast kode di bawah ini tepat di atas kode ]]></b:skin>

.newspic
 {background:#FFF 
url(http://4.bp.blogspot.com/-dx79apSnB6I/T3UoZVIgltI/AAAAAAAACxY/35LWW31ebL4/s1600/BRK+NW.png)
 no-repeat top left;BORDER:1PX SOLID #CDCDCD; width:840px;margin:0 
auto;padding:0 auto;height:23px;color:#000;}<br />
.news {width: 840px;margin:0 auto;padding:0 auto;line-height: 
1em;text-align:left;font-family:Arial;font-size:10px;color:#000;overflow:hidden;clear:both;}<br
 />
.news a:link, .news a:visited{color:#000;text-decoration:none;}<br 
/>
.news a:hover {color:#0099cc;text-decoration:underline;}

Cari kode </head> jika sudah ketemu pastekan kode di bawah ini tepat di atas </head>

<script

 
src='http://www.google.com/jsapi?key=ABQIAAAAUMsU2d40bO1-m8DeADFRexTdcQS31_Y0TkToW9tE1XWPEnv6YBSa1QfZaAr4GJ8-AZkWddpnW9Y0hA'/>
<script

 type='text/javascript'>
//<![CDATA[
var 
gfeedfetcher_loading_image="indicator.gif";google.load("feeds","1");function

 
gfeedfetcher(c,a,b){this.linktarget=b||"";this.feedlabels=[];this.feedurls=[];this.feeds=[];this.feedsfetched=0;this.feedlimit=5;this.showoptions="";this.sortstring="date";document.write('<div

 id="'+c+'" 
class="'+a+'"></div>
');this.feedcontainer=document.getElementById(c);this.itemcontainer="
<li>"}gfeedfetcher.prototype.addFeed=function(b,a){this.feedlabels[this.feedlabels.length]=b;this.feedurls[this.feedurls.length]=a};gfeedfetcher.prototype.filterfeed=function(b,a){this.feedlimit=b;if(typeof

 
a!="undefined"){this.sortstring=a}};gfeedfetcher.prototype.displayoptions=function(a){this.showoptions=a};gfeedfetcher.prototype.setentrycontainer=function(a){this.itemcontainer="<"+a.toLowerCase()+">"};gfeedfetcher.prototype.init=function(){this.feedsfetched=0;this.feeds=[];this.feedcontainer.innerHTML='<img

 src="'+gfeedfetcher_loading_image+'" /> Loading news...';var 
a=this;for(var b=0;b<this.feedurls.length;b++){var c=new 
google.feeds.Feed(this.feedurls[b]);var 
d=(this.feedlimit<=this.feedurls.length)?1:Math.floor(this.feedlimit/this.feedurls.length);if(this.feedlimit%this.feedurls.length>0&&this.feedlimit>this.feedurls.length&&b==this.feedurls.length-1){d+=(this.feedlimit%this.feedurls.length)}c.setNumEntries(d);c.load(function(e){return

 
function(f){a._fetch_data_as_array(f,e)}}(this.feedlabels[b]))}};gfeedfetcher._formatdate=function(a,c){var

 d=new Date(a);var 
b=(c.indexOf("datetime")!=-1)?d.toLocaleString():(c.indexOf("date")!=-1)?d.toLocaleDateString():(c.indexOf("time")!=-1)?d.toLocaleTimeString():"";return"<span

 
class='datefield'>"+b+"</span>"};gfeedfetcher._sortarray=function(a,b){var

 
b=(b=="label")?"ddlabel":b;if(b=="title"||b=="ddlabel"){a.sort(function(e,d){var

 g=e[b].toLowerCase();var 
f=d[b].toLowerCase();return(g<f)?-1:(g>f)?1:0})}else{try{a.sort(function(e,d){return

 new Date(d.publishedDate)-new 
Date(e.publishedDate)})}catch(c){}}};gfeedfetcher.prototype._fetch_data_as_array=function(b,a){var

 d=(!b.error)?b.feed.entries:"";if(d==""){alert("Google Feed API Error: 
"+b.error.message)}for(var 
c=0;c<d.length;c++){b.feed.entries[c].ddlabel=a}this.feeds=this.feeds.concat(d);this._signaldownloadcomplete()};gfeedfetcher.prototype._signaldownloadcomplete=function(){this.feedsfetched+=1;if(this.feedsfetched==this.feedurls.length){this._displayresult(this.feeds)}};gfeedfetcher.prototype._displayresult=function(a){var

 
e=(this.itemcontainer=="
<li>")?"<ul>\n":"";gfeedfetcher._sortarray(a,this.sortstring);for(var

 c=0;c<a.length;c++){var d='<a href="'+a[c].link+'" 
target="'+this.linktarget+'" 
class="titlefield">'+a[c].title+"</a>";var 
b=/label/i.test(this.showoptions)?'<span 
class="labelfield">['+this.feeds[c].ddlabel+"]</span>":" ";var 
g=gfeedfetcher._formatdate(a[c].publishedDate,this.showoptions);var 
f=/description/i.test(this.showoptions)?"<br 
/>"+a[c].content:/snippet/i.test(this.showoptions)?"<br 
/>"+a[c].contentSnippet:"";e+=this.itemcontainer+d+" "+b+" 
"+g+"\n"+f+this.itemcontainer.replace("<","</")+"\n\n"}e+=(this.itemcontainer=="
<li>")?"</ul>
":"";this.feedcontainer.innerHTML=e};
var

 gfeedfetcher_loading_image="indicator.gif";function 
gfeedrssticker(d,b,a,c){this.tickerid=d;this.delay=parseInt(a);this.mouseoverBol=0;this.itemsperpage=1;this.messagepointer=0;gfeedfetcher.call(this,d,b,c);this.itemcontainer="<div>
";this.tickerdiv=document.getElementById(d)}gfeedrssticker.prototype=new

 
gfeedfetcher;gfeedrssticker.prototype.constructor=gfeedrssticker;gfeedrssticker.prototype._displayresult=null;gfeedrssticker.prototype.entries_per_page=function(a){this.itemsperpage=a};gfeedrssticker.prototype._signaldownloadcomplete=function(){this.feedsfetched+=1;if(this.feedsfetched==this.feedurls.length){this._initscroller(this.feeds)}};gfeedrssticker.prototype._initscroller=function(a){var

 
c=this;gfeedfetcher._sortarray(a,this.sortstring);this.itemsperpage=(this.itemsperpage>=a.length)?1:this.itemsperpage;var

 
b=a.slice(this.messagepointer,this.itemsperpage);this.tickerdiv.innerHTML=formatrssmessage(b,this.showoptions,this.itemcontainer,this.linktarget);this.tickerdiv.onmouseover=function(){c.mouseoverBol=1};this.tickerdiv.onmouseout=function(){c.mouseoverBol=0};this.messagepointer=this.itemsperpage;if(window.attachEvent){window.attachEvent("onunload",function(){c.tickerdiv.onmouseover=c.tickerdiv.onmouseout=null})}setTimeout(function(){c._rotatemessage()},this.delay)};function

 formatrssmessage(d,b,f,g){var 
c=(f=="
<li>")?"<ul>\n":"";for(var e=0;e<d.length;e++){var
 h='<a href="'+d[e].link+'" target="'+g+'" 
class="titlefield">'+d[e].title+"</a>";var 
j=/label/i.test(b)?'<span 
class="labelfield">['+d[e].ddlabel+"]</span>":" ";var 
k=gfeedfetcher._formatdate(d[e].publishedDate,b);var 
a=/description/i.test(b)?"<br 
/>"+d[e].content:/snippet/i.test(b)?"<br 
/>"+d[e].contentSnippet:"";c+=f+h+" "+j+" 
"+k+"\n"+a+f.replace("<","</")+"\n\n"}c+=(f=="
<li>")?"</ul>
\n":"";return
 c}gfeedrssticker.prototype._rotatemessage=function(){var 
b=this;if(this.mouseoverBol==1){setTimeout(function(){b._rotatemessage()},100)}else{var

 
a=this.feeds.slice(this.messagepointer,this.messagepointer+this.itemsperpage);this.tickerdiv.innerHTML=formatrssmessage(a,this.showoptions,this.itemcontainer,this.linktarget);this.messagepointer=(this.messagepointer+this.itemsperpage>this.feeds.length-1)?0:this.messagepointer+this.itemsperpage;setTimeout(function(){b._rotatemessage()},this.delay)}};
//]]>
</script><br

 />
<style type='text/css'>
.titlefield{ /*CSS for RSS title link in general*/
text-decoration: none;}
.labelfield{ /*CSS for label field in general*/
color:#0099cc;font-size: 100%;}
.datefield{ /*CSS for date field in general*/
color:#aaa;font:normal 12px courier;text-transform:none;}
#example1{ /*Demo 1 main container*/
width: 960px;
height: 13px;
border: 0px solid #cdcdcd;
padding: 0px;
font:bold 13px courier;
text-transform:none;
text-align:left;
background-color:transparent;}
code{ /*CSS for insructions*/
color: #0099CC;}
#example1 a:link, #example1 a:visited 
{color:#0099cc;text-decoration:none;}
#example1 a:hover {color:#111;text-decoration:none;}
</style>

Lanjut lagi cari kode <div id='outer-wrapper'> Jika sudah ketemu silahkan pastekan kode berikut ini tepat di atas <div id='outer-wrapper'>

Jika sudah selesai Master Copast saranin jangan di save dulu. Lebih baik di Preview terlebih dahulu, jika memang tidak ada kekelirual langsung saja simpan dan lihat hasilnya.

Catatan :

Pada saat memasukan kode pada step trakhir sobat harus menganti tulisan http://copast-master.blogspot.com Jika sobat tidak mengantinya maka artikel yang akan muncul di breaking news adalah artikel dari blog Master Copast.

Demikian cara panjang namun nanti akan jadi hasil yang memuaskan untuk sobat semua. Sekian dulu hasil Master Copast kali ini artikel Tutorial Blog, yang berjudul Cara membuat breaking news di blog. Semoga bermanfaat Master Copast