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 !
October 20th, 2007 at 02:51:51
Salam kenal…..
Mas bisa bantu aq gak, soal nya aq udh coba bt list menu nya tapi kok gak bisa, cara posting nya gimana….
apa harus masukin judul/title nya satu2 or sekaligus…..
Cara masukin kode html nya gimana…..
trus yang ]]> tidak ada di kode css template blog saya…
mohon bantuan nya… THX
October 20th, 2007 at 14:12:27
Nah yang ini dah lama aku pengin tau caranya. Untung deh mas Is akhirnya bikin tutorialnya. makasih banyak mas. sukses d
October 20th, 2007 at 16:33:22
Wah ma kasih mas…
untuk blogger baru akan saya coba….ke tkpppppp
October 20th, 2007 at 21:14:52
Heru : tutorial ini hanya untuk template baru
October 20th, 2007 at 23:33:20
mas isnaini, semisal saya ambil artikel dari internet boleh tho?
October 21st, 2007 at 05:17:21
Mas saya udh bt template baru….. list menu nya udh jadi.
trus bagaimana cara membuat code link nya…….
Misal: list menu nya “Tentang”
biar pd wkt kita klik, langsung masuk ke profile blog kita.
thx…..
October 21st, 2007 at 10:08:59
Heru : silahkan di baca dan di coba kembali, kamu belum bikin page/postingan yang nanti akan tampil saat linknya di klik.
October 21st, 2007 at 18:57:41
Makasih mas atas infonya, baru juga kemaren request tutorial ini langsung ada… mas isnain emang the best…
Satu lagi mas, gimana bikin form kontak (isinya) agar pengunjung dapat mengisi form itu dan terkirim ke alamat email kita.
saya tadi dah nyoba melalui page source kontak mas isnain. Tapi setelah dicobain ngirim email… eeeh malah 404 error ga nemu server katanyah…
October 21st, 2007 at 20:34:52
Hakim Ibnurund: untuk form kontak aku belum nemu yg gampang aplikasinya buat blogspot. kalo ada, nanti aku kasih tau di blog ini.
October 21st, 2007 at 20:41:15
Horeee berhasil bikin listnya… thanks mas isnain.. two thumb for you!
October 21st, 2007 at 20:50:24
Buletin Jum’at online : tips biar halaman yang baru di bikin untuk menu/list gak muncul di halaman depan, edit post yg kamu jadikan list, ubah tanggal menjadi tanggal yg udah lewat, misalnya tanggal 2 bulan yang lalu.
October 21st, 2007 at 20:55:19
Okeh… thanks mas (again)…
October 21st, 2007 at 23:45:53
info yg berguna bgt… thx yah
October 22nd, 2007 at 00:24:04
Mas bisa tolong liat tampilan buletinnya sekarang… dikompi sayah ko jadi tumpang tindih ya… jadi ke samping kanan semua… apa yg salah…? Tadinya sayah ngotak-ngatik edit html dan menghapus css dari list O matic dan menggantinya dengan yg baru, tapi hasilnya jadi agak ribet begitu…!
Sebelum saya mulai dari awal lagi alias membangun templete 3 column nyoba dari mas dari pertama lagi mungkin mas bisa bantu, ada apa dengan tampilan blog buletin sy?
October 22nd, 2007 at 19:48:07
Kalau buat halaman contact yg pakai form mail gimana ya?…
October 23rd, 2007 at 05:05:44
Salam kenal Mas Is, info yang menarik, tanya kalau buat hal contact yang ada form mailnya gimana, terima kasih.
October 23rd, 2007 at 17:21:22
Wah berhasil nih seperti dipasang di blog saya . Klo mau buat tulisan dan besar kotak menunya supaya lebih besar gimana ya? Sy ud coba edit tp jadi kacau.
October 23rd, 2007 at 19:52:04
mas isnaini, bagaimana caranya menghapus “berlangganan: posting(atom)” yg ada dibagian bawah halaman blogger.
terima kasih ya mas
October 24th, 2007 at 08:11:25
Mas Isnaini, terimakasih atas infonya ini, tapi saya coba yg untuk horisontal kayak punya sampean, kok munculnya tetep vertikal, berjajar ke bawah. Kenapa ya, apa yang salah dengan langkah2 saya? Mohon bantuan dan terima kasin.
November 6th, 2007 at 16:34:02
Matur nuwun mas isnaini! siiiip…! terus tularin ilmunya ke kita-kita ya…
God bless you!
November 7th, 2007 at 18:41:21
aku udah coba , bisa muncul menu menu nya tapi waktu di klik tampilnya halaman tidak ditemukan ? gimana ini mas ? mohon solusi nya
December 26th, 2007 at 19:57:24
mas…..aq udah coba bikin list menu dan udah muncul…tapi ketika di klik tidak ada isinya…katanya url tidak ditemukan dalam server…piye to mas….pls bantuannya-
December 26th, 2007 at 20:41:23
f4dl1, benjrets: baca lagi, coba lagi. mungkin kamu belum bikin postingan yang akan jadi target/tujuan link kalo di klik
January 15th, 2008 at 12:55:34
Mas isnaini yang baik,
Buat posting itu apa sama denga buat posting baru.
untuk masukkan kode html lewat mana?
apa pake program lain, Thanks
January 18th, 2008 at 14:36:28
postingan itu harus di publish dulu ato gimana mas,
jadi bingung nie…
trus tau url nya itu gimana
January 27th, 2008 at 01:19:58
mas saya udah coba tapi gagal terus, kalo buat posting supaya bisa ngelink ke url nya gimana?? Tolong ya mas thanks
February 3rd, 2008 at 11:28:50
Thanks a lot anyway for your valuable time preparing your tutorial (Especially for this topic) Keep high spirit bro
February 7th, 2008 at 20:53:22
Terima kasih banyak atas informasi yang diberikan
March 2nd, 2008 at 18:28:33
#kang is aku nyari tulisan= ” caranya nyelipkan / naruk “/ . itu lo kang kaya bambang utoro naruk suara tutorialnya ?
March 9th, 2008 at 22:20:18
Trima kasih banyak kang ……. aku dah mraktekin ini , Acung Jempol dua tangan buat akan , tapi butuh modifikasi kang , awalnya sih gak keluar …. justru aku studi banting ke dalam otak dan praktik lapangan 2 hari baru bisa
trima kasih ya kang ….
ttd anak kemarin sore
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
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
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
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
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 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 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 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…?
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.
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 24th, 2008 at 17:25:31
thanks ya mas, akhirnya ak bisa buat menu di blog ak, tapi masalahnya gimana cara kita menempatkan postingan kita ke dalam sub-sub menu yang telah kita buat List-O-Matic ?
tolong informasinya ya
thanks