TRIK & TRIK

TRIK MEMBUAT LABEL UNTUK MEMPERCANTIK BLOG

Setelah di artikel sebelumnya saya telah membagikan cara membuat daftar isiberdasarkan tanggal, sekarang waktunya membagi cara membuat daftar isi atau sitemap berdasarkan kategori di blogspot. Hasilnya lebih kurang seperti gambar dibawah ini., berikut cara membuatnya:

1. Login ke akun blogger anda
2. Pilih "Template" dan klik "edit HTML"
3. Cari tag ini ]]></b:skin>, gunakan Ctrl-F dalam mencari
4. Paste kode berikut sebelum tag ]]></b:skin>
   

   .judul-label{ 
   background-color:#E5ECF9; 
   font-weight:bold; 
   line-height:1.4em; 
   margin-bottom:5px; 
   overflow:hidden; 
   white-space:nowrap; 
   vertical-align: baseline; 
   margin: 0 2px; 
   outline: none; 
   cursor: pointer; 
   text-decoration: none; 
   font: 14px/100% Arial, Helvetica, sans-serif; 
   padding: .5em 2em .55em; 
   text-shadow: 0 1px 1px rgba(0,0,0,.3); 
   -webkit-border-radius: .5em; 
   -moz-border-radius: .5em; 
   border-radius: .5em; 
   -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2); 
   -moz-box-shadow: 1px 1px 4px #AAAAAA; 
   box-shadow: 0 1px 2px rgba(0,0,0,.2); 
   color: #e9e9e9; 
   border: 2px solid white !important; 
   background: #6e6e6e; 
   background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757)); 
   background: -moz-linear-gradient(top,  #888,  #575757); 
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757'); 
   } 
   .data-list{ 
   line-height:1.5em; 
   margin-left:5px; 
   margin-right:5px; 
   padding-left:15px; 
   padding-right:5px; 
   white-space:nowrap; 
   text-align:left; 
   font-family:"Arial",sans-serif; 
   font-size:12px; 
   } 
   .list-ganjil{ 
   background-color:#F6F6F6; 
   } 
   .headactive{ 
       color: #fef4e9; 
       border: 2px solid white !important; 
       background: #1C8DFF; 
       background: -webkit-gradient(linear, left top, left bottom, from(#9dc2e7), to(#438cd2)); 
       background: -moz-linear-gradient(top,  #9dc2e7,  #438cd2); 
       filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dc2e7', endColorstr='#438cd2'); 
   }

5. Simpan tapi belum selesai ya..
6. Selanjutnya, Klik "Laman", "Laman baru" dan "Laman kosong"
   
   


7. Paste kode dibawah ini di bagian "HTML" 
   
   

   <script src="http://nurulimaminfo.googlecode.com/files/daftarisiv2-pack.js">
   
   </script> 
   <script src="http://www.TOMNSECURESHELL.BLOGSPOT.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc">
   </script> 
   <script type="text/javascript">
   var accToc=true; 
   </script> 
   <script src="http://deroc.googlecode.com/files/accordion-pack.js" type="text/javascript">
   </script>

   
   Ganti TOMNSECURESHELL.BLOGSPOT dengan blog anda. 
8. "Simpan" dan "Publish". Pekerjaan selesai!