Cara Membuat Menu Breaking News Di Bawah Menu Navigasi

Tuturial Cara Membuat Menu Breaking News Di Bawah Menu Navigasi, nah sudah lama ideini tidak memberikan Tutorial Blogging, kemarin ada sahabt ideini yang meminta untuk dibuatkan Tutorial Membuat Menu Breaking News Di Bawah Menu Navigasi, mungkin Tutorial Membuat Menu Breaking News Di Bawah Menu Navigasi  ini sudah banyak dibahas oleh blog blog lain, namun tidak ada salahnya saya memberikan lagi untuk sahabat saya yang sudah merequsetnya.

Nah untuk melihat contohnya bisa lihat dibawah menu blog ini ada widget Breaking News, itu adalah hasilnya, mungkin nanti hasilnya tidak akan sama, karena milik saya sudah saya modifikasi dari kode aslinya, kamu nanti bisa memodifikasi untuk menyesuakian dengan template blog kamu. baiklah langsung aja simak Tutorial Membuat Menu Breaking News Di Bawah Menu Navigasi

• 1. Login ke Blogger.com
• 2. Pilih Rancangan >> Edit HTML
• 3. Lalu centang kotak Expand Template Widget. Dan jangan lupa untuk memback-up dulu template kamu untuk jaga-jaga bila terjadi kesalahan.
• 4. Jikas sudah sekarang cari kode ]]></b:skin>
• 5. Lalu Letakan kode berikut tepat di atas kode ]]></b:skin> tadi. 

/* Menu Breaking News
---------------------------------------------*/
.newspic {background:#FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcUefehCrBY2iXI2uge7LTsCWiCIF4fdD7h4Cd5U-0lIO9bBufUv7ZKq5wyyLpjT7Ff8n8lZjs4va9iohEwIb4hiiQIkHBVR-kII_KA_V4tHkO0uZSqLapVTJxlo54b8sdvkyQcHRNXj8/s1600/BRK+NW.png) no-repeat top left;BORDER:1PX SOLID #CDCDCD; width:938px;margin:0 auto;padding:0 auto;height:23px;color:#000;}
.news {width: 938px;margin:0 auto;padding:0 auto;line-height: 1em;text-align:left;font-family:Arial;font-size:10px;color:#000;overflow:hidden;clear:both;}
.news a:link, .news a:visited{color:#000;text-decoration:none;}
.news a:hover {color:#0099cc;text-decoration:underline;}  

• 6. Lalu letakkan kode di bawah ini tepat di atas kode </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 Arial;text-transform:none;} #example1{ /*Demo 1 main container*/ width: 960px; height: 13px; border: 0px solid #cdcdcd; padding: 0px; font:bold 13px Arial; 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>

• 7. Setelah itu cari kode yang kira-kira mirip seperti ini :

<div id='nav-element'>
.....................................
</div>

• Kode ini bisa berbeda dengan yang ada di blog kamu, intinya letakkan saja kode nya di bawah kode navigasi kamu yang kira-kira miripnya seperti ini :

<div id='nav-element'>
<div id='nav'>
<div id='nav-left'>
<ul>
<li><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></li>
<li><a href='http://www.ideini.com/2011/08/daftar-isi.html' title='Daftar Isi/Archive'>Archive</a></li>
<li><a href='http://www.ideini.com/2011/08/daftar-link-sahabat.html' title='Lihat Link teman teman Ideini.Com'>Link Friends</a></li>
<li><a href='http://www.ideini.com/2012/01/pengunjung-masuk-sini-part-2.html' title='Please sign the Guest Book'>Guestbook</a></li>
<li><a href='http://www.ideini.com/2011/06/recent-comment-on-ideinicom.html' title='Look Recent Comments'>Comments</a></li>
<li><a href='http://www.ideini.com/2011/06/nonton-tv-online.html' title='Nonton TV Online Yuk'>TV Online</a></li>
</ul>
<script language='javascript'>setPage()</script>
</div>
</div>
</div>

• 8. Masukkan kode di bawah ini tepat di bawah kode </div> yang ada di atas :

<div class='newspic'>
<div style='float:left;width:938px;padding:3px 0 3px 124px; 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://ideini.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>

• 9. Klik Pratinjau, setelah cocok baru klik SIMPAN

NP :

• Ganti tulisan ideini.com berwarna biru dengan URL blog kamu.
• Untuk lainya bisa disesuaikan masing masing.

Nah itu tadi Tutorial Cara Membuat Menu Breaking News Di Bawah Menu Navigasi semoga bisa dipahami dan bermanfaat ^_^

Membuat Recent Comment Dengan Javascript

Ideini.com - Membuat Recent Comment Dengan Javascript, baiklah temen temen pada postingan kali ini, ideini kembali memberi sedikit Tutorial Blogging, tentang Membuat Recent Comment Dengan Javascript, postingan ini juga demi memenuhi permintaan dari salah satu sahabat ideini.com yang ingin Membuat Recent Comment seperti di blog ideini, nah sebenarnya cara membuatnya juga cukup mudah, karena ini javascript, jadi kamu tinggal copy paste aja scriptnya dan ubah sedikit saja, baiklah berikut cara Membuat Recent Comment Dengan Javascript :

1. Login ke Blogger

2. Pilih Rancangan

3. Lalu pilih Tambah Gadget pada salah satu Elemen

4. Sekarang kamu copy Kode dibawah ini :

<div style="overflow:auto;width:AUTO;height:120px;border:1px dotted #e41212;padding:8px;margin:10px 0 0"> <script style="text/javascript" src="http://files.bloggerplugins.org/widgetcomments.js"></script><script style="text/javascript">var a_rc=20;var m_rc=true;var n_rc=true;var o_rc=60;</script><script src="http://ideini.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script> <div style="font-size:9px; padding:8px 0px 0px 0px"></div></div>

5. Lalu  paste kan kedalam Kolom Gadget yang akan kamu tambahkan:

6. Klik Simpan

//Keterangan: 
width:AUTO :  ini berfungsi untuk menatur Lebar Scroll kotak  Recent Comments 
height:120px :  ini berfungsi untuk mengatur Tinggi scroll  Recent Comments

border:1px dotted #e41212 : ini berfungsi mengatur Tebal garis,Jenis garis dan Warna garis
20 : ini berfungsi untuk mengatur jumlah komentar yang akan di tampilkan
ideini.com : Ganti tulisan ini dengan alamat blog kamu

Nah itu tadi Tutorial Blogging cara Membuat Recent Comment Dengan Javascript, mudah mudahan dapat dimenegerti dan bermanfaat :) jika ada yang kurang jelas bisa di tanyakan pada kotak komentar (ideini.com)

Domain Domain Gratis!!!

Ideini.com - Domain Domain Gratis, ideini mau bagi bagi info nih, tentang Domain Domain Gratis, Domain Gratis ini bukan .COM, .INFO, .NET, .EDU, .BIZ, tapi Domain Domain Gratis yang ideini bagikan yaitu Domain yang bersifat forwarding yaitu domain ini hanya menyingkat domain belakang misalnya .blogspot.com disingkat menjadi .tk atau co.cc dll,

ex : ideini.blogspot.com to> ideini.tk, ideini.co.cc , ideini.de.nu,  dll

 nah keuntunganya menggunakan Domain Domain Gratis ini yaitu dapat mempersingkat alamat blog/web kita sehingga lebih tampak profesional. bagaimana tertarik?

ideini menyediakan beberapa website yang menyediakan Domain Domain Gratis. semoga bermanfaat :)

http://www.co.cc

Domain Gratis yang diberikan :

co.cc

http://www.dot.tk

Domain Gratis yang diberikan :

tk

http://www.nic.cz.cc

Domain Gratis yang diberikan :

cz.cc

http://www.nic.de.nu
Domain Gratis yang diberikan :
de.nu

http://www.duonic.com

Domain Gratis yang diberikan :

at.nr, de.nr, co.at.nr

http://www.lavanic.com

Domain Gratis yang diberikan :

ch.lv, de.lv, co.at.lv, or.at.lv

http://www.neunic.com

Domain Gratis yang diberikan :

de.vc, at.vc, co.at.vc, or.at.vc, ch.vc

http://www.europnic.com
Domain Gratis yang diberikan :
co.at.gg, de.gg, co.at.gg, ch.gg, fr.gg

http://www.nic.at.vu

Domain Gratis yang diberikan :

or.at.vu, co.at.vu, de.vu, ch.vu

http://us.unonic.com

Domain Gratis yang diberikan :

int.tf, net.tf, eu.tf, int.tf, edu.tf, us.tf, ca.tf, bg.tf, ru.tf, pl.tf, cz.tf, de.tf, at.tf, co.at.tf, ch.tf, sg.tf

http://us.popnic.com
Domain Gratis yang diberikan :
it.pn, uk.pn, us.pn, au.pn, com.au.pn, de.pn, co.at.pn, fr.pn, it.pn, cn.pn, jp.pn

http://us.cydots.com
Domain Gratis yang diberikan :
fr.ms, net.ms, info.ms, us.ms, shop.ms, au.ms, com.au.ms, de.ms, fr.ms, cn.ms, hk.ms, br.ms, com.br.ms, net.br.ms, org.br.ms, biz.br.ms, info.br.ms, etc.br.ms

http://www.mediadots.com/

Domain Gratis yang diberikan :

us.mn, uk.mn, co.uk.mn, eu.mn, au.mn, com.au.mn, at.mn, co.at.mn, fr.mn, nl.mn, it.mn, cn.mn, jp.mn

http://www.smartdots.com

Domain Gratis yang diberikan :

net.tc, eu.tc, us.tc, uk.tc, co.uk.tc, me.uk.tc, org.uk.tc, au.tc, com.au.tc, pro.tc, shop.tc, edu.tc, int.tc, de.tc, at.tc, co.at.tc, ch.tc, it.tc, es.tc, ru.tc, ua.tc, se.tc, dk.tc, be.tc, no.tc, pl.tc, bg.tc, cz.tc, hu.tc, ie.tc, mx.tc, br.tc, com.br.tc, net.br.tc, org.br.tc, biz.br.tc, info.br.tc, etc.br.tc, hk.tc, kr.tc, th.tc, ph.tc

Untuk Domain .com sampai sekarang masih belum ada yang gratis total, jadi ideini memilih untuk tidak merekomendasikan, tapi ada yang menyediakan domain gratis selama 1 tahun penuh dengan cara mencari 9 referals, jika ingin mencoba silahkan Klik DISINI atau menjadi referal dari ideini.com  dengan cara klik pada link ini Domain Gratis 1 Tahun Full 100%,   sesama blogger tidak ada salahnya jika saling membantu, 

Semoga info Domain Domain Gratis ini dapat bermanfaat bagi temen temen semua. silahkan di coba :D

Membuat Widget Artikel Terbaru Ala ideini.com

IDEINI.COM - Cara Membuat Widget Artikel Terbaru. Ideini ingin berbagi Tutorial Blogging Membuat Widget Artikel Terbaru seperti yang ada di sidebar blog ini, selain itu tadi ada seorang sahabat yang menanyakan Cara Membuat Widget Artikel Terbaru yang ada di blog ideini, nah di Widget Artikel Terbaru yang ini ada beberapa fitur tambahanya, yaitu terdapat pilihan kategorinya, sehingga ketika di pilih salah satu kategori maka yang muncul adalah artikel terbaru pada kategori tersebut. nah untuk contohnya bisa  dilihat di sidebar di samping atau lihat gambar di bawah ini, untuk cara buatnya silahakn ikuti langkah langkahnya :

1. Login Ke Blogger.com
2. Klik Pada Rancangan >> Elemen Laman 

3. Pilih Tambah Gadget

4. Pilih HTML/ Javascript

5. Beri Judul Widget

5. Lalu Paste kode berikut di dalamnya :

<div style="background: none repeat scroll 0% 0% rgb(242, 242, 242);  -moz-border-radius:5px; border: 1px solid rgb(204, 204, 204); height: 350px; overflow: auto; padding: 10px;">
<span id="pbl_labels"></span>
<div id="pbl_posts">
Recent Posts </div>

<script type="text/javascript">
var jumlah_maksimum_post = 20;
var dengan_ringkasan = true;
var jumlah_karakter_ringkasan = 100;
</script>

<script src="http://copycat91.googlecode.com/svn/trunk/recentpostsbylabel.js">
</script>

<script src="http://www.ideini.com/feeds/posts/default?alt=json-in-script&amp;callback=onLoadFeed">
</script></div><a href="http://www.ideini.com/2012/02/membuat-widget-artikel-terbaru-ala.html" target="_blank" title="Mau Widget Seperi Ini? Klik Aja">Widget by ideini.com</a></div>

7. Setelah Itu Klik Simpan.

Keterangan :
   Ganti www.ideini.com dengan alamat URL blog kamu

   height: 350px : (adalah tinggi widget, bisa disesuaikan dengan keinginan masing masing.)
   var jumlah_maksimum_post = 20;    (Adalh Jumlah Entri yang akan di tampilkan pada Widget)
   var jumlah_karakter_ringkasan = 100;  (Adalah Jumlah karakter teks cuplikan yang akan   ditampilan)

Nah Itu Tadi Cara Membuat Widget Artikel Terbaru Ala Ideini.com, semoga Bermanfaat.(ideini)

Cara Membuat Widget Artikel Terbaru Cara Membuat Widget Artikel Terbaru Cara Membuat Widget Artikel Terbaru Cara Membuat Widget Artikel Terbaru

Parse Kode HTML

IDEINI.COM - Parse Kode HTML, Silahakan Gunakan Fasilitas Tools Parse Kode HTML, Tools Parse Kode HTML ini digunakan Untuk Memparse Kode Javascript yang akan dimasukan kedalam Postingan ataupun di Template, karena beberapa kode javascript akan muncul sebagai widget saat di letakan di postingan jika tifak di Parse terlebih dahulu, begitu pula pada Template Blog, beberapa Kode Javascript tidak dapat bekerja sebelum di Parse dahulu, biasanya akan terjadi Erorr, Baiklah silahkan Gunakan Tools Parse Kode HTML dibawah ini.

Caranya: Paste Kode Javascript yang ingin kamu Parse kedalam Kotak lalu Klik Convert

Semoga Tools Parse Kode HTML ini berguna untuk teman teman semua. (ideini)

Parse Kode HTML Tools Parse Kode HTML  Parse Kode  HTML  Parse Kode HTML.

Parse Kode HTML Parse Kode HTML Parse Kode HTML Parse Kode HTML