Cara Menciptakan Atau Membuat Menu Dtree Di Blog

Bloggermyid Juli 29, 2018 0 Comments

Apa itu sajian Dtree (D-Tree) ? itu lho sajian yang mempunyai struktur menyerupai pohon, yang punya cabang-cabang itu lho, Seperti kalo kita membuka Windows Explorer. Menu yang menyerupai gambar dibawah ini atau menyerupai contoh ini.

dtree

Menu Dtree ini sangat mempunyai kegunaan kalau kau mempunyai postingan yang buanyak, sebab dengan memakai sajian Dtree maka akan dapat menghemat space/ruang yang ada di blogmu. Nah kau pingin tahu cara membuatnya?

Beginilah cara membuatnya :

1. Login to Blogger, trus pilih “Layout –> Edit HTML”
2. Taruh arahan berikut ini diatas arahan <head>

<link rel=”StyleSheet” href=”http://www.geocities.com/uddin_81/dtree.css” type=”text/css” /><script type=”text/javascript” src=”http://www.geocities.com/uddin_81/dtree.js”></script>

3. Trus Klik Tombol “Save

4. Setelah itu copy arahan berikut ini dan pasang di sidebar kamu, udah tahu tho cara pasangnya? itu lho di sajian “Page Element” trus klik “Add a Gadget –> HTML/Javascript”. Inolah script yang harus kau copy di sidebar kamu.

<div class=”dtree”><script type=”text/javascript”> <!– d = new dTree(‘d’); d.add(0,-1,’My example tree’); d.add(1,0,’Node 1′,’link.html‘); d.add(2,1,’Node 1.1′,’link.html‘); d.add(3,2,’Node 1.1.1′,’link.html‘); d.add(4,3,’Node 1.1.1.1′,’link.html‘); d.add(5,0,’Node 2′,’link.html‘); d.add(6,5,’Node 2.1′,’link.html‘); d.add(7,5,’Node 2.2′,’link.html‘); d.add(8,0,’Node 3′,’link.html‘); d.add(9,0,’Node 5′,’link.html‘);document.write(d);//–> </script></div>

berikut ini keteranganya:
– Ganti goresan pena “link.html” dengan link kau (judul posting kamu).
– Angka yang pertama harus unik dihentikan ada yang sama (d.add(1,0,’Node 1’,’link.html’);
– Angka yang kedua merupakan cabang dari angka pertama (perhatikan angka-angka yang mempunyai warna sama).

– Kamu dapat mengganti icon-iconnya dengan icon kau sendiri, pola scriptnya akan menyerupai ini: