Cara Membuat Menu DTree atau Menu Buka Tutup Seperti Windows Explorer di Blogspot

Menu ini namaanya "DTree", berikut ini "Cara Membuat Menu DTree atau Menu Buka Tutup Seperti Windows Explorer"

1. Masuk ke editor HTML pada blogger (sudah tau kan tempatnya, kalau belum tau bisa tulis komentar di bawah)
2. Cari kode </head>
3. Paste script html dibawah ini di paste di atasnya kode </head> :
<!--css-nya dtree-->
  <link href='http://sites.google.com/site/ecaknyo/blog/dtree.css' rel='StyleSheet' type='text/css'/>
<script src='http://sites.google.com/site/ecaknyo/blog/dtree_ecaknyo.js' type='text/javascript'/> 
<!--css-nya dtree-->
4. Save
5. Buat Postingan baru atau "New Post"
6. Pilih format penulisan yang "HTML" bukan yang COMPOSE
7. Paste kode html dibawah ini dan edit sesuka hati :
<div class="dtree">

<p><a href="javascript: d.openAll();"><img src="http://sites.google.com/site/ecaknyo/blog/plus.gif" /><b>Open all</b></a> | <a href="javascript: d.closeAll();"><img src="http://sites.google.com/site/ecaknyo/blog/minus.gif" /><b>Close all</b></a></p>

<script type="text/javascript">
<!--

d = new dTree('d');

d.add(0,-1,'BANI HAMID','URL HomePage');

 d.add(2,0,'Khadijah & Hasan')

  d.add(3,2,'Erna & Yusuf','');
   d.add(10,3,'Neni & Wandi','URL Artikel');
   d.add(20,3,'Iwan & Ona','URL Artikel');
   d.add(30,3,'Anis & Marno','URL Artikel');
   d.add(40,3,'Irul & Ratna','URL Artikel');

  d.add(4,2,'Mastjik & Aini','');
   d.add(10,4,'Arif & Anissa','URL Artikel');
   d.add(20,4,'Alfi & Tanti','URL Artikel');
   d.add(30,4,'Agus & Mayda','URL Artikel');

  d.add(5,2,'Dya & Anis','');
   d.add(10,5,'Yasmien & Faiz','URL Artikel');
   d.add(20,5,'Rumi','URL Artikel');
   d.add(30,5,'Amilah & Rocky','URL Artikell');
   d.add(40,5,'Aulia & Agie','URL Artikell');

  d.add(6,2,'Aisyah & Hadi','');
   d.add(10,6,'Zuhdi & Fifi','URL Artikel');
   d.add(20,6,'Wulan & Yoyok','URL Artikel');
   d.add(30,6,'Indra & Ndari','URL Artikell');
   d.add(40,6,'Ledya & Risco','URL Artikell');
   d.add(50,6,'Rachmi & Johan','URL Artikell');

  d.add(7,2,'Husein)','');

  d.add(8,2,'Turmudzi & Yani','');
   d.add(10,8,'Mukhtar & Sadiyah','URL Artikel');
   d.add(20,8,'Rafif','URL Artikel');
   d.add(30,8,'Nisrinaa','URL Artikell');
   d.add(40,8,'Safina','URL Artikel');

  d.add(9,2,'Fachruddin & Tati','');
   d.add(10,9,'Qoonitah','URL Artikel');
   d.add(20,9,'Faiq','URL Artikel');
   d.add(30,9,'Fathiyyah','URL Artikell');
   d.add(40,9,'Haarits','URL Artikel');
   d.add(50,9,'Rifqi','URL Artikel');
   

document.write(d);

//-->
</script>

</div>
8. Save

Hasilnya akan seperti Live Preview dibawah ini:

Open all | Close all




Dapatkan Article Terbaru ke Email kawan,
Masukkan Alamat Email,
lalu klik link konfirmasi yg terkirim ke Email kalian:
  

Subscribe untuk menerima update gratis di email:

0 Response to "Cara Membuat Menu DTree atau Menu Buka Tutup Seperti Windows Explorer di Blogspot"