Cara Memasang Breaking News di Blog

Cara Memasang Breaking News di Blog - Ada yang baru dengan tampilan christian tatelu, blog jelek ini kini dilengkapi dengan breaking news. Breaking news adalah widget yang dipasang dengan tujuan memperindah tampilan blog dan juga untuk  meningkatkan pageview blog. Widget ini berupa judul artikel yang ditampilkan secara bergantian yang terkadang juga di sertai dengan tanggal posting artikel tersebut.

Sebenarnya postingan kali ini hampir sama dengan postingan sebelumnya ( baca : cara membuat headline news di blog ) tapi mungkin yang ini ( breaking news ) agak sedikit lebih keren. Sobat yang tertarik memasang widget ni, silahkan ikuti tutorial berikut.


Cara Memasang Breaking News di Blog

1. Login dulu ke akun blog sobat
2. Klik rancangan --> Edit HTML
3. Letakkan kode berikut di atas kode ]]></b:skin>
.newspic {background:#252525 url(http://3.bp.blogspot.com/-GoZGUMDvx8g/T1je4hEa9iI/AAAAAAAAA7E/aOfllbW_qOc/s1600/BRK+NW.png) no-repeat top left;width:979px;margin:0 auto;padding:0 auto; height:24px;color:#fff;}
.news {width: 979px;margin:0 auto;padding:0 auto;line-height: 1.2em;text-align:left;font-family:Arial;font-size:11px;color:#fff;overflow:hidden;clear:both;}
.news a:link, .news a:visited{color:#000000;text-decoration:none;}
.news a:hover {color:#ddd;text-decoration:underline;}

Catatan :
Sesuaikan kode yang berwarna biru dengan ukuran template blog sobat


4. Kemudian letakkan kode berikut di atas kode </head>
<script src='http://www.google.com/jsapi?key=ABQIAAAAUMsU2d40bO1-m8DeADFRexTdcQS31_Y0TkToW9tE1XWPEnv6YBSa1QfZaAr4GJ8-AZkWddpnW9Y0hA'></script>
<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>
<style type='text/css'>
.titlefield{ /*CSS for RSS title link in general*/
text-decoration: none;}
.labelfield{ /*CSS for label field in general*/
color:#aaa;font-size: 100%;}
.datefield{ /*CSS for date field in general*/
color:#aaa;font:normal 14px Arial;text-transform:none;}
#example1{ /*Demo 1 main container*/
width: 780px;
height: 14px;
border: 0px solid #aaa;
padding: 0px;
font:bold 16px Arial;
text-transform:none;
text-align:left;
background-color:transparent;}
code{ /*CSS for insructions*/
color: #fff;}
#example1 a:link, #example1 a:visited {color:#f2f2f2;text-decoration:none;}
#example1 a:hover {color:#C8D3F2;text-decoration:none;}
</style>

5. Cari kode <div id='header-wrapper'> ( gunakan Ctrl + F ) dan letakkan kode berikut tepat di bawahnya.
<div class='newspic'>
<div style='float:left;width:979px;padding:1px 0 6px 130px; position:relative; overflow:hidden;'>
<script type='text/javascript'>
var cssfeed=new gfeedrssticker(&quot;example1&quot;, &quot;example1class&quot;, 4000, &quot;_new&quot;)
cssfeed.addFeed(&quot;Creating Website&quot;, &quot;http://christiantatelu.blogspot.com/feeds/posts/default&quot;) //Specify &quot;label&quot; plus URL to RSS feed
cssfeed.displayoptions(&quot;date&quot;) //show the specified additional fields
cssfeed.setentrycontainer(&quot;div&quot;) //Wrap each entry with a DIV tag
cssfeed.filterfeed(10, &quot;date&quot;) //Show 10 entries, sort by date
cssfeed.entries_per_page(1)
cssfeed.init()
</script>
</div>
<div style='clear:both;'/>
</div>

Catatan :
Ganti http://christiantatelu.blogspot.com dengan url blog sobat.

6. Klik save dan lihat hasilnya.

Ditulis Oleh : christian angkouw ~ Cara Bikin Blog

Christian angkouw Sobat sedang membaca artikel tentang Cara Memasang Breaking News di Blog. Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya

:: Get this widget ! ::

73 comments

boleh juga nih sob untuk dicoba, thanks atas info tutorialnya

mantap gan.., klo boleh tau sumberx dr mana ya..?

btw link sobat dah aq pasang..terima kasih.. *smile

kenapa di blog sy ga ada kode yang ke tiga ya div id='header-wrapper' atau bisa dengan kode lain

08:29:00

iya gan,,,
bener kata moh adin purnoma ga ada tuh kode id='header-wrapper'> ???

cuma triks ini yang paling gampang di pasang...mantap bro...mampir juga ke warung saya ya bro http://purnomosymb19.blogspot.com/

thanks atas infonya gan...

14:47:00

mantap gan :)
langsung terpasang di blog ane breaking news nya :D

thnks gan atas ilmu yang telah diberikan,,,soalnya saya telah berhasil mempraktekkannya diblog saya,,,salam persahabatan selalu

23:59:00

bro,bisa gak breaking news-nya berada d bawah?

blognya bgus gan...smoga Allah SWT memberikan berkah pdamu...amin...

makasih dek...sangat bermanfaat buat saya yang belajar bikin blog.
kasih saran dong buat blog saya:
http://ypmmd.blogspot.com

salam gohu padis
hehehehe

siiipppp
visit http://www.bocahdoko.co.cc/

Assalammualaikum...
Makasih Tipsnya,saya cari2 Nih yang kaya Gini..

01:09:00

tnx info nya gan jgn lupa kunjungi blog ku juga http://duniamotivasi1.blogspot.com/

siph..
tengkyu bro...

Terimakasih tutorial sangat bermanfaat!
mau nanya, itu cara untuk membuat breaking news nya perintah nomer 5, kok tidak ada ya kodenya ditempat saya? Mungkin sobat2 lainnya juga bisa membantu ?

salam blogger. ;)
http://kandang-rayap.blogspot.com/

top ilmunya,tq gan langsung praktek

Artikel bermanfaat...

Thanks infox tentang blog

tes dicoba gan,,

belakangan ini, agak lama nge-save template html blogger ya ..

5. Cari kode < id='header-wrapper'> ( gunakan Ctrl + F ) dan letakkan kode berikut tepat di bawahnya.

revisinya < class='header-outer'>

btw thank ya bos atas infonya

keren niy..tampilan blog jd kelihatan fresh

makasih buat sharing infonya..semoga bermanfaat,khususnya buat pemula seperti saya...

Cara yang ke 5, udah dicari pake ctrl + F gk ada mas !

Anonymous
10:44:00


Here is my webpage - cordyceps sinensis

22:33:00

terima kasih gan, sudah saya pasang di blog.

thanks sobat atas informasi artikelnya. ini sgt bermanfaat sekali

mantap gan yang ini bagus artikelnya.. thnks

Sukses selalu tutorialnya sob

Makasih buat infonya...saya coba di blog saya

Siiiiip gan. thanks ya

Keren juga nih gan, Insya Allah saya coba nih ^_^

makasih sob atas infonya :D
salam http://nandarious.blogspot.com

18:48:00

mas Ganteng ? aq dah behasil buatnya tapi letaknya kok di tengah tengah. tidak bisa di atas....dan tanggal update kok jadi huruf cina ....mohon bantuanya.....
http://laginemu-trik.blogspot.com sungguh tak harapkan bantuannya. terimakasih banyak

Anonymous
04:53:00



my site :: How to Win the lottery

Nice Post Gan . .
Jangan lupa mampir di blog kami ..
http://whit3h4ck.blogspot.com/

tips yg menarik gan , thnks

Keren banget nih. . Dah gue coba di blog gue. . mantap. . coba liat deh bagus apa ngak?
http://abouthealth.tarakan-id.com/

Anonymous
13:05:00

Valuable info. Fortunаtе me I
ԁiscovегed your websіtе accіdentally, and I am surprіѕed why this accident did
not happenеd in advancе! I bookmarked it.


Feel frеe to surf to my webѕite webdesign

Keren penampakan breaking news nya ya! Jadi pengen pasang nih di blog. :D

terima kasih informasi nya sob,,,sangat membantu sekali
kunjungan balik nya di Dhani's Blog

Anonymous
13:08:00

Αttгactive sectiοn of content.
I just stumbled upon your web site and in acceѕsion сapital to
assert that I acquiге actually enjoyed аccount
yоur blog posts. Anyωaу I will be subscгіbing to your augment and even Ι achievement yοu aссesѕ consiѕtently
quickly.

Μy weblοg: buy domains

Anonymous
13:08:00

Hi there colleagues, its fantaѕtic articlе about еducationаnd еntirely definеԁ, keep іt up all the time.


Feel free to visit my wеb page - buy domain google

Anonymous
13:50:00

Eveгуthіng publіѕhed maԁe a gгеat deal of
senѕe. But, what about this? suppοѕe you weгe tο wгіte a killer headline?
Ι mean, І don't wish to tell you how to run your blog, however suppose you added a headline that makes people want more? I mean "Cara Memasang Breaking News di Blog" is kinda plain. You should glance at Yahoo's front pаge and ѕee how they wгitе post headlіneѕ to gеt vieweгs tο clіck.

Үou might add a related ѵideo oг а pictuгe or two to grab peoplе excited about everything've got to say. Just my opinion, it might make your posts a little bit more interesting.

Also visit my web site - CREATING A WEBSITE

Anonymous
04:22:00

I for all time emailed this webpagе ρost ρage to all mу associateѕ, bеcause if like to геаd it аfter that my contacts will too.



Visit my web-site Plantillas web

10:05:00

Thanks ya gan

Kalau Berkenan Kunjungi blog saya
www.LivaKara.com

WORK 100 % gan, keren lagi.. ayo pasang, jangan lupa mampir di http://sentraeduksi.blogspot.com/

Anonymous
15:07:00

My brother rеcommended I may like thiѕ web site.
He used to be totally гight. This post аctuallу made
mу day. Υou can not conѕіder just
how much time I had ѕρent for this infoгmation!
Thank yоu!

Here іs my page :: creare sito online

Anonymous
15:07:00

Appreсiаte this post. Let me try it out.


Μy ωeb blog :: fare un sito internet gratis

Anonymous
00:44:00

For most up-to-ԁatе news you have tо pay a
vіsit thе wеb and on the
web I fοund this site as a best web site fοr newest
updates.

Mу sitе; come creare Un Sito web html

Anonymous
02:21:00

Verу great post. I ѕimply stumbled upon your blog anԁ ωаnteԁ tο mention thаt Ι've really loved browsing your weblog posts. In any case I'll
bе subѕcribing on уour feed anԁ I'm hoping you write once more very soon!

my site comprar dominio

Anonymous
02:21:00

What's up to all, for the reason that I am genuinely keen of reading this webpage's
post to be updаtеd on a гegulаr basis.
It carries pleasant іnfoгmation.

Also vіsit mу sіte; desarrollo web

Anonymous
04:44:00

Hi сοlleagues, hoω is the ωhole thing, and what уou
would lіke tο say cοnсerning
this article, іn my viеw itѕ genuіnelу awesοme for mе.


my blog: Website Maken

Mantap banget infonya, ijin dipraktekkan bos.

Anonymous
13:55:00

Thankѕ for sharing your thoughts about Criе seu sitе.
Regards

my webpagе; criar site

Anonymous
06:48:00

Very good post. I certainly love this webѕіte.
Keеp it uр!

My web blog :: How to make A Website

Anonymous
18:38:00

I love what уou guys arе up toο. This soгt of сlevеr worκ and exposure!
Keeρ up the fantastic worκs guуs I've added you guys to my blogroll.

Have a look at my weblog: Como Fazer Um Site

Anonymous
05:46:00

I just like the helpful infοrmation уou supρly on уouг аrticles.
I'll bookmark your blog and check once more right here frequently. I am slightly certain I'll be told lots of new stuff proper rіght here!
Best of luсk for the next!

My web blog :: http://asilomanila.com/

cocok banget nih gan trimm yah,,,
http://belajarbisnisbriliant.blogspot.com/

nice gan

23:05:00

Praktek dulu soob

Anonymous
13:39:00

Howdу would yοu mind sharing which blog platform уou're using? I'm going
to staгt my oωn blog in the near future but I'm having a tough time choosing between BlogEngine/Wordpress/B2evolution and Drupal. The reason I ask is because your design seems different then most blogs and I'm
loοking foг something unіque.
P.S Sorгy for being off-topiс but I had to ask!


my ѕite Achat nom de domaine

Thanks for sharing. It is very amazing.

Selalu dapet solusi dari Blog yang keren ini.. Thanks

sangat bermanfaat... thanks

Sangat membantu, arigatou ^w^

kunjung balik yaa jkt48files.blogspot.com

17:47:00

gan ko cuma loading news ya...?
tolong di bantu gan...
Free_share freelance blog

Mantep Gan Thanks,Infonya Makasih !!

Poskan Komentar

Silahkan tinggalkan komentar sobat dan dapatkan backlink satu arah langsung ke blog sobat dengan widget top komentator yang saya pasang di sidebar blog ini. Caranya dengan menjadi pemberi komentar terbanyak di blog ini, tapi mohon jangan Nyepam ya..! Komentar dengan menyertakan LINK / ANCHOR TEXT atau promosi produk tertentu akan saya hapus karena blog ini bukan tempat untuk mempromosikan produk yang dijual di blog anda.