Bikin Blog Lebih Dinamis III

Klik disini untuk demo.

Ga usah basa-basi kita langsung praktekin ajah nie triksnya :

1. Seperti biasa Backup terlebih dahulu template anda.
2. Edit HTML, centang "Expand Template Widget", lalu cari widget yang akan disembunyikan isinya,misal "Labels" kodenya seperti ini :
<b:widget id='Label1' locked='false' title='Labels' type='Label'> <b:includable id='main'> <b:if cond='data:title'> <h2><data:title/></h2> </b:if> <div class='widget-content'> <ul> <b:loop values='data:labels' var='label'> <li> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'> <data:label.name/> </span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'> <data:label.name/> </a> </b:if> <span dir='ltr'>(<data:label.count/>)</span> </li> </b:loop> </ul> <b:include name='quickedit'/> </div> </b:includable> </b:widget>
3. Hapus kode <h2><data:title/></h2> lalu ganti dengan kode berikut :
* <h2 class='title'><script type='text/javascript'> /* <![CDATA[ */ if(typeof(rnd) == 'undefined') var rnd = ''; rnd = Math.floor(Math.random()*1000); rnd = 'id-' + rnd; document.write('<a href="#" onclick="tmp = document.getElementById(&quot;' + rnd + '&quot;); tmp.style.display = (tmp.style.display == &quot;none&quot;) ? &quot;block&quot; : &quot;none&quot;; return false;" style="float:right;margin-right:0px;">[Open]<\/a>'); /* ]]> */ </script><data:title/></h2><script type='text/javascript'> /* <![CDATA[ */ document.write('<div id="' + rnd + '" style="display:none;">'); /* ]]> */ </script>
4. Setelah itu sisipkan kode dibawah ini, persis diatas </b:includable>
* <script type='text/javascript'> /* <![CDATA[ */ document.write('<\/div>'); /* ]]> */ </script>
5. Nah kalau dah digabung hasilnya kaya gini nie :
<b:widget id='Label1' locked='false' title='Labels' type='Label'> <b:includable id='main'> <b:if cond='data:title'> <h2 class='title'><script type='text/javascript'> /* <![CDATA[ */ if(typeof(rnd) == 'undefined') var rnd = ''; rnd = Math.floor(Math.random()*1000); rnd = 'id-' + rnd; document.write('<a href="#" onclick="tmp = document.getElementById(&quot;' + rnd + '&quot;); tmp.style.display = (tmp.style.display == &quot;none&quot;) ? &quot;block&quot; : &quot;none&quot;; return false;" style="float:right;margin-right:0px;">[Open]<\/a>'); /* ]]> */ </script><data:title/></h2><script type='text/javascript'> /* <![CDATA[ */ document.write('<div id="' + rnd + '" style="display:none;">'); /* ]]> */ </script> </b:if> <div class='widget-content'> <ul> <b:loop values='data:labels' var='label'> <li> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'> <data:label.name/> </span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'> <data:label.name/> </a> </b:if> <span dir='ltr'>(<data:label.count/>)</span> </li> </b:loop> </ul> <b:include name='quickedit'/> </div> <script type='text/javascript'> /* <![CDATA[ */ document.write('<\/div>'); /* ]]> */ </script> </b:includable> </b:widget>
6. Simpan Template anda.

Anda bisa ubah [Open] sesuai keinginan, misal Buka, Lihat dll. nah semoga bermanfaat ya.. selamat mencoba..