> Warung Bebas

Cara Membuat Headline News Keren Di Blog

Kali ini saya akan posting tentang cara membuat headline news Keren. Langsung aja Ikuti Langkah-langkahnya dibawah ini. :

Headline news
  • Login Ke Akun Blogger Kamu
  • Setelan >> Edit HTML >> Expand Widget Template
  • Backup Dulu Template Kamu Untuk Jaga-jaga Jika Terjadi Kesalahan
  • Lalu Paste kode Ini Tepat Diatas  ]]></b:skin>

/* News Ticker Wrapper */ .newspic {background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjphXCG9Ot0GWbxgulYXA-tcz9hgAEopQVJ4h0GV58r3cuVz7dM0B2Bdife1nPFCEw_ucK3YcdkECracLIruNQPEIdsjRcohgnCVig16rtkFt0qzF4QHMwwFnGhIbfmvj_VJqoQjYzQDYg/s1600/headline.png) no-repeat top left;width:940px;margin:0 auto;padding:0 auto;height:28px;color:#ff0000;} .news {width: 940px;margin:0 auto;padding:0 auto;line-height: 1.4em;text-align:left;font-family:Arial;font-size:11px;color:#fff;overflow:hidden;clear:both;} .news a:link{color:#ff0000;font-weight: bold;text-decoration:none} .news a:visited{color:#ddd;font-weight: bold;text-decoration:none} .news a:hover{color:#fff;font-weight: bold;text-decoration:underline}


** Warna Merah Bisa Diganti Sesuai Selera
  • Copy Code Dibawah ini Tepat Diatas Kode  </head>

<script src="http://www.google.com/jsapi?key=ABQIAAAA4qkT5i26SQ6NmgJd5KQemhRQ_a6zv5_Bim3H_GL4gaueIFZ15xRdt8jcAUk8ZHokIVo-TBZgYVbkzw" type="text/javascript"> <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+'" /> INFONETGUE';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>

  • Lalu Sekarang adalah langkah Penempatan Widget Headline nya, Terserah anda mau Dipajang dimana. Tapi kali ini saya akan Memberikan Tutorial Memasang Headline News Diatas Judul Header Blog.
  • Untuk Menaruh Widget di atas Judul Header, Copy Kode dibawah ini Tepat Dibawah <body>

<div class='newspic'> <div class='news'> <div style='float:left;padding:5px 60px 5px 7px;font:bold 14px Arial;color:#333;text-transform:none;'> Berita Terbaru : </div><div style='float:left;width:700px;padding:4px 0; 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;FakhrianAmrullah&quot;, &quot;http://arya96.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><div style='clear:both;'/> </div>

  • Ganti Tulisan Merah dengan Link URL Kamu, Lalu Tulisan Kuning Dengan Kata-kata mu.
  • Save Template & Lihat hasilnya. 
  • Selamat Mencoba
Cara Membuat Headline News Keren Di Blog 9 Out Of 10 Based On 10 Ratings. 9 User Reviews.
Share 'Cara Membuat Headline News Keren Di Blog' On ...

Ditulis oleh: Arya Dharma - Minggu, 15 Juli 2012

14 komentar untuk "Cara Membuat Headline News Keren Di Blog"

  1. gak bisa mas ,,,kok terjadi galat bX-jyl3cm ...gimana cara ngatasinya ??

    BalasHapus
  2. @fajar dengerousCoba ikutin dulu dg hati2 cara diatas,, mungkin ada yg salah masukinnya,, :) smoga berhasil

    BalasHapus
  3. saya coba ya Mas, BTW bkin blog kita loadnya lama gg Mas? thanks atas postingannya Happy Blogging :)

    BalasHapus
  4. mantap mas bro... ijin pasang gan

    BalasHapus
  5. wah ini gan yang ane cari, artikel membuat headline newsnya bermanfaat gan,,
    makasih udh posting artikel ni..

    BalasHapus
  6. mangstab tutor nya gan, lengkap pake skrinsut, jd gampang ngikutinnya

    BalasHapus
  7. makasih banyak gan tutorialnya berhasil sangat membantu sekali gan. salam blogger

    BalasHapus
  8. izin nyoba kawan. mudah-mudahan berhasil
    terimakasih sudah berbagi.

    BalasHapus
  9. bagus ya kalau dikasih itu..hehehe
    tar saya coba dulu. terimakasih kawan..

    BalasHapus
  10. thank's gan,, selama Hampir 2 minggu akhirnya ketemu dengan yang Aku harapkan,, thank's gan

    BalasHapus