Popular Post

Posted by : Unknown Monday, October 6, 2014

Blogroll adalah kumpulan link ke beberapa blog lain. Blogroll biasanya ditempatkan di baris samping (sidebar) homepage. Pada tutorial kali ini saya akan berbagi cara membuat blogroll dengan mode show-hide, sehingga akan lebih menghemat tempat.

Berikut cara membuat Widget Blogroll Show Hide :
  • Login ke blogger, Pilih Tata Letak.
      

  • Klik Add a Widget dan pilih HTML/Javascript.
  • Lalu letakkan kode berikut :
    <div class="widget-content"><div><div style="margin: 5px;"><div class="normalfont" style="margin-bottom: 2px;"><input onclick="if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;TUTUP&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Link Sahabat&#39;; }" value="Link Sahabat" style="margin: 0px; padding: 5px; width: 100%; font-size: 14px; background: none repeat scroll 0% 0% blue; border-radius: 8px;" type="button" /></div><div class="alt2"><div style="display: none;"><div style="text-align: justify; padding: 2px;"><center><blink><h4>Link Sahabat</h4></blink></center><div style="overflow: auto; width: 270px; height: 200px; padding: 10px; border: 1px solid rgb(238, 238, 238);">

    <div style="text-align: center;"><a href="http://alamatblog.com/" target="_blank">Text</a></div>
    <div style="text-align: center;"><a href="http://alamatblog.com/" target="_blank">Text</a></div>

    </div></div><div style="text-align: right;"><font size="0.1">Widget by <a href="http://wadahtutorial.blogspot.com/" target="_blank">Tutorial Blog</a></font></div></div></div></div></div></div>

  • Keterangan :
    blue : Warna background, silakan diganti sesuai keinginan Anda.
    width: 270px; height: 200px; : Ukuran lebar dan tinggi widget, sesuaikan dengan sidebar Anda.
    <a href="http://alamatblog.com/" target="_blank">Text</a> : Ganti dengan Link yang anda inginkan
  • Terakhir klik Save.
Sekian tutorial tentang Cara membuat Widget Blogroll Show Hide. Semoga Bermanfaat :)

Sumber : http://www.wadahtutorial.blogspot.com/

Leave a Reply

Subscribe to Posts | Subscribe to Comments

- Copyright © Your Tutorial's Is Here!!! - Date A Live - Powered by Blogger - Designed by Johanes Djogan -