Bikin menu label dengan List-O-Matic

Ada yang ingin membuat menu seperti di sidebar saya? (Tutorial Blog dan About Indonesia), menu itu saya buat dengan List-O-Matic, Tujuannya sih biar postingan itu bisa dilirik orang yang membutuhkan, jadi biar keliatan kalau Aryo sudah bikin postingan apa saja sih. Apalagi kalau anda mempunyai postingan andalan, bikin deh menu yg bisa dilihat pada saat halaman pertama dibuka. Memang blog saya masih meraba-raba sih, tapi dengan berjuang yailah lebai ya, berusaha maksudnya, apapun jadi bisa kita lakukan. Postingan ini seperti biasa saya tujukan buat yang belum tahu cari bikin menu dengan list-o-maticmenunya bentuk nya spt ini (hirarki-nya)

About Indonesia (menu/atau url label)
- Tanjung karang beach (judul/url postingan/link, pokoknya terserah deh)
- Cilacap Beach (judul/url postingan)
Indonesia Artis (menu)
- Dian sastro (Judul link/postingan)
- Kawin cerai artis (judul link/postingan)

Pertama kita buka dulu List-O-Matic, tidak perlu login kok,ini cm semacam tool gratisan saja buat anda. Nah disitu ada tampilan seperti dibawah ini :

Ini tampilan pertama










Kalau mau tambah label klik "(+) add navigation top level dan contreng kotak kecil lg untuk judul postingan/link.










Maka akan muncul seperti dibawah ini, contoh dibawah adalah menu label saya.
Nah isi link text dengan judul label/menu atau judul postingan (tergantung mau ada isi label apa tidak, ya istilahnya hirarki), lalu isi adress url dengan url label atau url link/postingan kamu, title attr bisa dikosongkan kok. Sekali lagi isi nama label dan url label, lalu nama judul postingan dan url/link postingan. Kalau mau tambah label klik "(+) add navigation top level dan contreng kotak kecil lg untuk judul/link postingan.














Setelah selesai masukan semua nama dan url, Lalu klik "I'am Done, show me the style", pilih style yg kamu suka











Selesai pilih style? Klik "show me the markup, akan muncul kode HTML hasil dari inputan kita spt dibawah ini, lalu copy paste ke gedget HTML/Jaba script yang sudah ditambahkan di blog kita













Kembali ke blog, tambah gedget HTML/Java Script, lalu paste
Jadi deh....

Lalu gimana kalau mau tambah judul postingan? Tinggal edit dan copy saja kode HTML untuk postingan di menu gedget, lalu paste dibawahnya dan ganti urlnya dengan url postingan yang mau ditambahkan.
Seperti ini misalnya :

<li><a href="http://aryosp.blogspot.com/search/label/Tourisme" title="e.g. 'Information about the company ...">Indonesian Tourisme</a>
<ul>
<li><a href="http://aryosp.blogspot.com/2009/07/borobudur-temple-largest-budhist-temple.html">Borobudur Temple , The Largest Buddhist Temple</a></li>
<li><a href="http://aryosp.blogspot.com/2009/07/tanjung-karang-beach-central-sulawesi.html">Tanjung Karang Beach Central Sulawesi Indonesia </a></li>

Kalau sudah copy, ganti url lama dengan url baru (yang aryo warnain hijau), dan judul postingan jg diganti (warna merah).

Kalau tambah menu baru(label) beserta judul postingannya? Tenang saja, aku sudah otak atik tetep gak bisa hehehe..mksdnya hirarki nya gak bener urutannya, terus aku coba bikin baru di LIST O MATIC LAGI dan aku copy paste hasil kode html dibawah kode html yang sudah ada di blog kita, dan hasilnya ..wow..bisa..! Pintar-pintarlah otak-atik, Aryo kasih panduan cm dasarnya saja. Misalnya yang warna hijau itu hasil dari tambahan bikin di list-o-matic, jadinya spt ini :

About Indonesia (menu/atau url label)
- Tanjung karang beach (judul/url postingan/link, pokoknya terserah deh)
- Cilacap Beach (judul/url postingan)
Indonesia Artis (menu)
- Dian sastro (Judul link/postingan)
- Kawin cerai artis (judul link/postingan)
Info Indonesia
-Bom Meledak (ah judul sekenanya deh, pusing)

Nah cukup kan? Belum? Maksudnya biar tidak makan tempat? Yang nggulung itu? Roll? atau apalah? tambahkan saja pada posisi paling atas kode HTML seperti dibawah ini:

<div style="overflow:auto;width:300px;height:200px;padding:10px;border:1px solid #eee">
Ya sudah met coba..

Nah ganti yang warna hijau (lebar & tinggi kolom) sesuai selera..tapi kolom baru akan menggulung jika isinya sudah tidak muat pada lebar dan tinggi kolom lho.

Posted By Aryo

Related Posts by Categories