Membuat Widget Spoiler Recent Comment

Sebelumnya saya pernah posting tentang Widget Recent Post Valid XHTML,
widget tersebut menggunakan scroll sehingga dapat menghemat tempat di
sidebar blog Anda. Kali ini saya akan berbagi tentang tutorial Membuat
Widget Recent Posts Menggunakan Spoiler, cara ini juga sangat berguna
untuk menghemat tempat di sidebar blog.

Berikut cara Membuat Widget Recent Posts Menggunakan Spoiler :

• 
  Login ke blogger, klik Design > Page Element.
  
  


• 
  Klik Add a Widget dan pilih HTML/Javascript.
  
  


• Lalu letakkan kode berikut di area konten widget :
  
  
  

  
  Kode Script :

  
  

  
  

  
  <div style="margin: 1px;"><div class="smallfont"
  style="margin-bottom: 2px;"><input onclick="if
  (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
  != '') {
  this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
  = ''; this.innerText = ''; this.value = 'Close'; } else {
  this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
  = 'none'; this.innerText = ''; this.value = 'Recent Posts'; }"
  style="font-size: 11px; margin: 0px; padding: 0px; width: 150px;"
  type="button" value="Recent Posts" /></div><div class="alt2"
  style="border: 1px inset; margin: 0px; padding: 6px; text-align:
  left;"><div style="display: none;  height: 250px; overflow:
  auto;"><script type="text/javascript"
  src="http://html-scripts.googlecode.com/files/recent-posts.js"></script><script
  type="text/javascript">
  
  var numposts = 10;var
  
  showpostdate = true;var
  
  showpostsummary = true;var
  
  numchars = 50;var
  
  standardstyling = true;
  
  </script><script type="text/javascript" src="http://wadahtutorial.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts"></script></div></div></div>

  
  

  
  
  
  Silakan ganti wadahtutorial.blogspot.com dengan alamat blog Sobat.


• 
  Terakhir klik Save.
  
  
  
  
  Selesai...
  
  Berikut contoh hasilnya :
  
  
  

  
  

  
  

  
  

  
  
  Membuat Link Membesar Saat disentuh Kursor - 24 Apr
  Tutorial kali ini tentang trik atau cara untuk...(Baca Selengkapnya...)
  
  Zhefa Blogger template - 21 Apr
  Template Details :Platform TypeBlogger /...(Baca Selengkapnya...)
  
  Membuat Gambar Membesar Saat disentuh Cursor - 17 Apr
  Mungkin sebagian Blogger sering melihat gambar...(Baca Selengkapnya...)
  
  Cara Menghapus Waktu Komentar - 14 Apr
  Beberapa hari yang lalu pada postingan Cara...(Baca Selengkapnya...)
  
  Membuat Dua Kolom Widget di Blogspot - 10 Apr
  Kadang template yang kita gunakan tidak sesuai...(Baca Selengkapnya...)
  
  Cara Menghilangkan Link Langganan Entri Atom - 02 Apr
  Link langganan entri atom di blog biasanya ada di...(Baca Selengkapnya...)
  
  Memberi Efek Taburan Bintang di Blog - 30 Mar
  Sebelumnya saya berbagi salah satu cara untuk...(Baca Selengkapnya...)
  
  Tips Mengatasi Pencurian Artikel Blog - 27 Mar
  Ketika saya menemukan sebuah blog yang mencuri...(Baca Selengkapnya...)
  
  Memberi Efek Taburan Hati di Blog - 21 Mar
  Kali ini saya akan berbagi salah satu cara untuk...(Baca Selengkapnya...)
  
  Mengatasi Duplikasi Deskripsi Meta - 08 Feb
  Duplikasi deskripsi meta pernah di alami blog...(Baca Selengkapnya...)
  
  

  
  Supported by : Tutorial Blog

  
  

  
  

  
  
  
  

Sekian tutorial tentang Membuat Widget Recent Posts Menggunakan Spoiler.