Cara Membuat Menu di Blogspot dengan List-O-Matic
Banyak yang nanyain cara bikin menu seperti yang aku pake di blog ini. Untuk blogspot, sebelum membuat menu, halaman yang akan di link sebaiknya di buat dulu dari postingan biasa, karena di blogspot tidak ada fasilitas membuat halaman, yang ada hanya membuat postingan. jadi menu kita nantinya akan di link ke postingan yang udah kita buat.
Misalnya kamu ingin membuat menu Depan, Tentang, dan Portofolio. maka kamu harus membuat postingan dengan Judul/Title: Depan, Tentang, dan Portofolio, dengan demikian kita akan mempunya 3 halaman dengan url http://nama.blogspot.com/depan.html, http://nama.blogspot.com/tentang.html dan http://nama.blogspot.com/portofolio.html.
Selanjutnya ikuti langkah-langkah pembuatan menu secara otomatis menggunakan List-O-Matic. Setelah semua langkah di lakukan, kamu akan di beri 2 jenis kode yaitu HTML dan CSS.
Here is the HTML for this list:
<div id="navcontainer">
<ul id="navlist">
<li><a href="http://nama.blogspot.com/depan.html">Depan</a></li>
<li><a href="http://nama.blogspot.com/tentang.html">Tentang</a></li>
<li><a href="http://nama.blogspot.com/portofolio.html">Portofolio</a></li>
</ul>
</div>
Copy kode HTML dan masukkan lewat Add a Page Element - HTML/JavaScript dan letakkan dimana kamu pengen menunya muncul.
Here is the CSS for this list:
#navlist ul
{
margin-left: 0;
padding-left: 0;
white-space: nowrap;
}
#navlist li
{
display: inline;
list-style-type: none;
}
#navlist a { padding: 3px 10px; }
#navlist a:link, #navlist a:visited
{
color: #fff;
background-color: #036;
text-decoration: none;
}
#navlist a:hover
{
color: #fff;
background-color: #369;
text-decoration: none;
}
Sedangkan untuk kode CSS harus di copy dan di letakkan dalam kode template. Di halaman template blog kamu, pilih Edit HTML, letakkan kode CSS dari List-O-Matic tadi sebelum kode ]]></b:skin> dan save template.
Selamat Mencoba !
August 3rd, 2008 at 14:46:59
Hi, mas isnaini aku uda buat list menu dengan buat postingan terlebih dahulu tapi koq selalu URLnya ada tanggalnya gitu yah seperti isnaini.com/2008/08/about/
sedangkan mas isnaini punya kan isnaini.com/about/ (tanpa tanggal), gmana ya supaya url nya bisa seperti ini, saya uda utak atik di format pengaturannya tapi ga ketemu nih.
Tolongin donk…
thanks a lot
August 1st, 2008 at 05:29:16
semua intruksi sudah dilaksanakan,hasilnya list menu sudah muncul sesuai keinginan.Tapi di klik diam saja nggak ada respon.Tolong kasih penjelasan lagi ya mas…. anu inyong bodoh pisan kiyee…hehehehe .tHANK INFONYA.
July 18th, 2008 at 15:18:36
thanks ya Udah Bisa bkin Menu Home nie….!
eh 1 lagi kali bikin Coment box d Bologtuh g mn ya…?
July 16th, 2008 at 13:21:23
maap nie temen2. melihat respon2 yg ada di topik ini maupun topik2 lain, kayakya banyak dari temen2 yang kudu belajar dari dasar dulu ttg blog/web, css dan html baru bisa menikmati tips2 disini. kalo ngga bakal dapat kesulitan pas mempraktekkan tutorial2 yang dibuat mas isnaini disini. masa nyari url postingan ndak tau toh.. ntar salah2 postingan bisa hilang semua loh…
lagian pastilah mas isnaini bakal ga jawab pertanyaan2 yg udah jelas2 dijelasin di postingannya… (mungkin punya saya juga hikz)
maap sekali lagi bukan sok pinter, tapi saya juga belajar web/blog/html/css dari internet juga metik sana metik sini.. dulu trial adn error deh, krn saya nganggap enteng akhirnya yang gampang2 jadi ndak tau, akhirnya nemu banyak masalah pas ngerjainnya. so saya putusin buat balik belajar dari dasar…
gudluck for all
July 16th, 2008 at 13:05:49
Halo mas isnaini. thanks alot buat ilmunya. saya udah buat menu list di blog saya dan berhasil. tapi… coba mas visit blog saya, saya pengen posisi menu listnya ke kanan. sedangkan punya saya ada di tengah dengan menggunakan HTml nah gimana caranya supaya ngeposisi in ke kanan ya mas?
Ditunggu supportnya
thank you
@prima
supaya menu list link ke postingan. kamu copy hyperlink postingan kamu ke masing2 menu list sesuai dengan judul yang kamu buat. coba kamu visit blog ku, pas kamu arahkan mouse kamu ke menu list ku, di taskbar browser, kamu bisa lihat linknya… goodluck
July 11th, 2008 at 12:45:17
mas mw nanya nie… cara biar tag menunya ada di Atas(dibawah judul blog) caranya gmana ya?? kode html nya di taruh dimana biar sama kyk mas itu lho…
ditugu jawabnya segera….
thx b4
Regards
funday
July 11th, 2008 at 09:48:11
mas is, aku dah buat seperti petunjuk mas tp kok List menu menggeser body ya? sehingga side kanan tergeser ke bawah. web template aku pake pny mas is yang dua kolom…maunya sih tambah kolom menu, salam kenal dari temannya Wira/ sastrawan
May 22nd, 2008 at 17:05:29
mas aku udah berhasil bikin list menunya…tapi aku bingung cara postingnya biar bisa ngelink dengan menu yg udah aku bikin (sebelum bikin menu aku udah bikin postingannya)…aku udah coba lewat postingan biasa tapi belum berhasil.tolong mas bantuannya biar menuku bisa ngelink ke postingannya…tolong send ke emailku hoseamualif@gmail.com.tks
May 3rd, 2008 at 11:14:50
MAS…CARA MENGISI LIST MENU GIMANA,AKU UDAH BERHASIL BIKIN MENU LIST YANG MASIH BINGUNG UNTUK MENGISI LIST MENUNYA,MISALNYA KALO DI BLOG MAS ISNAINI AKU KLIK MENU FREE TEMPLE BISA MASUK KEHALAMAN MENU TEMPLE…ITU CARANYA GIMANA MAS
April 12th, 2008 at 23:11:34
thanks ya mas…mo saya coba nih…btw,yang artikel read more nya sakti juga..dah berhasil.!!!!ehehehehehe..temen saya yang jaga warnet aja udah seminggu nyoba ga bisa2..sekali saya baca punya mas,lgsg bisa..sakti..sakti..hehehe…saya add link mas yah..
Bagi yang perlu informasi seputar Teknik Lingkungan,silakan di coba di
http://www.envirolover.blogspot.com
disini Bisa di download beberapa koleksi data Teknik Lingkungan saya..hehehehehe….
Regards
Miftahhurrahman
miftahhur_rahman@yahoo.com