Memang belum tersedia fitur untuk mengedit top menu pada template blogger, tapi mungkin nanti akan ada fitur untuk mengubah menu top blogger, seperti jika kita menggunakan drupal / joomla / mambo yg praktis hanya tinggal menginstal fitur list top menu yang bisa di ubah-ubah.
Cara Pertama.
1. Login ke blogger > rancangan > edit html > edit template, centang expand template widget.
2. Backup. Copas dahulu seluruh kode html template ke dalam Notepad dan simpan.
3. Ctrl F lalu cari kode "<div id='menu'>", kalau di blog saya seperti ini, biasanya ada sedikit perbedaan dengan kode template blog kalian.
4. Nanti akan terlihat kode sesudah "<div id='menu'>" yang seperti contoh dibawah ini.
<div id='menu'>
<ul>
<li><a Title='Home' expr:href='data:blog.homepageUrl'>Home</a></li>
<li><div class='gap'/></li>
<li><a href='http://id-id.facebook.com/people/Andi-Wong/1222512287'>About</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"'>Posts RSS</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"'>Comments RSS</a></li>
<li><div class='gap'/></li>
<li><a href='http://www.blogger.com/'>Login</a></li>
</ul>
</div>
</div>
<ul>
<li><a Title='Home' expr:href='data:blog.homepageUrl'>Home</a></li>
<li><div class='gap'/></li>
<li><a href='http://id-id.facebook.com/people/Andi-Wong/1222512287'>About</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"'>Posts RSS</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"'>Comments RSS</a></li>
<li><div class='gap'/></li>
<li><a href='http://www.blogger.com/'>Login</a></li>
</ul>
</div>
</div>
1) Ubahlah nama menu yang saya warnai ungu seperti contoh diatas...
2) URL yang saya warnai biru juga diubah sesuai dengan nama menu yang kamu tentukan...5. Simpan template & reload blog.
Jika ingin menambah lagi menu blog tinggal copas kode html top menunya saja seperti contoh dibawah ini :
<div id='menu'>
<ul>
<li><a Title='Home' expr:href='data:blog.homepageUrl'>Home</a></li>
<li><div class='gap'/></li>
<li><a href='http://id-id.facebook.com/people/Andi-Wong/1222512287'>About</a></li>
<li><div class='gap'/></li>
<li><a href='menambah menu di tengah'>Tambah Menu di tengah</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"'>Posts RSS</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"'>Comments RSS</a></li>
<li><div class='gap'/></li>
<li><a href='http://www.blogger.com/'>Login</a></li>
<li><a href='menambah menu dibawah'>Tambah Menu dibawah</a></li>
</ul>
</div>
Cara Kedua
1. Jika kode html top menu di Contoh I berbeda dengan kode top menu di template kamu, coba yang ini.
2. Ctrl F lalu cari kode "<div class='Menu'>".
2. Ctrl F lalu cari kode "<div class='Menu'>".
3. Nanti akan ada kode sesudah "<div class='Menu'>" seperti contoh dibawah ini.
<div class='Menu'>
<ul>
<li><a href='/'><span>Home</span></a></li>
<li><a href='#' title='About'><span>About</span></a>
</li>
<li><a href='#' title='Contact'><span>Contact</span></a>
</li>
<li><a href='#' title='Extras'><span>Extras</span></a>
</li>
</ul>
</div>
<ul>
<li><a href='/'><span>Home</span></a></li>
<li><a href='#' title='About'><span>About</span></a>
</li>
<li><a href='#' title='Contact'><span>Contact</span></a>
</li>
<li><a href='#' title='Extras'><span>Extras</span></a>
</li>
</ul>
</div>
1) Ubah nama menu yang diwarnai ungu.
2) Url yang diwarnai biru juga diubah, sesuaikan saja.5. Simpan template & reload blog.
Jika ingin menambah lagi menu blog tinggal copas kode html top menunya saja seperti contoh dibawah ini.
<div class='Menu'>
<ul>
<li><a href='/'><span>Home</span></a></li>
<li><a href='#' title='About'><span>About</span></a>
</li>
<li><a href='menambah menu di tengah' title='#'><span>Tambah Menu di tengah</span></a>
<li><a href='#' title='Contact'><span>Contact</span></a>
</li>
<li><a href='#' title='Extras'><span>Extras</span></a>
</li>
<li><a href='menambah menu dibawah' title='Extras'><span>Tambah Menu dibawah</span></a>
</ul>
</div>
<ul>
<li><a href='/'><span>Home</span></a></li>
<li><a href='#' title='About'><span>About</span></a>
</li>
<li><a href='menambah menu di tengah' title='#'><span>Tambah Menu di tengah</span></a>
</li>
<li><a href='#' title='Contact'><span>Contact</span></a>
</li>
<li><a href='#' title='Extras'><span>Extras</span></a>
</li>
<li><a href='menambah menu dibawah' title='Extras'><span>Tambah Menu dibawah</span></a>
</li>
</ul>
</div>
Selamat Mencoba.
salam sobat
ReplyDeleteduh edit template lagi ya,,
saya akan coba nanti, semoga tidak kesulitan.
NURA > silahkan kapan2 dicoba ya :D
ReplyDeletememang agk susah....
ReplyDeletetapi klo mau tau memang hrus di coba :)
dede > kalo sering dipraktekan tutorial blognya.. walopun terkadang menambah masalah.. tpi itu malah akan membuat kita semakin mengerti & otomatis akan mencari solusi yg baik.. :)
ReplyDeletekunjungan balik gan ;)
ReplyDeletesalam kenal..
Blog tjah jaranan > salam kenal gan.. salam blogger ;)
ReplyDeleteNice tutorial sharing. :)
ReplyDeleteKeren hib tutorial'a, like this ! *_^
ReplyDeletebener bener mantab nih info buat blog kita...
ReplyDeletethnxs for info....good luck ya,...
Tongkonan > thx gan.. :)
ReplyDeleteMujahid Cinta > makasih.. tutor sederhana ini gan.. dibuat agar mudah dipahami.. :)
Gieterror > baguslah kalo bermanfaat ;)
ijin di-save dulu bang untuk suatu saat diperlukan, makasih ya ...
ReplyDeleteterima kasih mas untuk tukeran linknya, Link anda udah dipasang di blog saya. mampir lagi yah.
ReplyDeleteWarna Tulisan > silahkan di save dulu johnson :)
ReplyDeleteAmi Junior > oke.. gw mampir gan.. ;)
Brooo,.... tanya ni...!
ReplyDeletedi blog ku dulu aku pasang daftar coment terbaru ama link disorot pelangi, dan hasilnya uda fungsi smua. tapi kenapa sekarang ko malah gak fungsi semua ya??? file js nya pun baik2 aja. mohon penjelasannya ;)
saya udah pernah nyoba gan...
ReplyDeletetapi kok gak bisa2 ya? terutama mu ganti yang Post RSS..
:(
hope google make this feature ASAP..
Cerita Dewasa > heuum... file js recent comments & lik pelangi-nya kamu simpan dimana gan.. di google site atau di server file lainnya... ?? atau kamu pake Js punyaku.. ?
ReplyDeletengga dikasih previewnya tah?
ReplyDeleteijin save ya mas, aku juga penen edit2 top menu juga kapan2
ReplyDeleteBrooo, yang pelangi aku pake punya mu, tapi kalo yang comment aku pake google site punya q. dan awalnya dulu fungsi semua. tapi sekrang malah diem... hehhehe
ReplyDeletelupa belum komen disini...
ReplyDeletehehehe...
mantep nih, menu nya gak pake css...
jadi loadingnya cepat...
tapi sayang bos, gak bisa nambahin sub menu nya ya...
aku dah follow, follow balik brooo
ReplyDeletewah keren juga ya bisa menyala2 gitu ,hehe aku sih cuma pake list o matic biar gampang ,hehe
ReplyDeletesalam kenal, aku follow ya
"Nice artikel, inspiring ditunggu artikel - artikel selanjutnya, sukses selau, Tuhan memberkati anda, Trim's :)"
ReplyDeletemaaf master andi oot coment saya, saya mau tanya, kepa recent coment saya bermaslah, masak yg muncul comentar lama, komentar baru g muncul di blog saya, akhirnya sementara saya lepas dulu recent coment saya, sampai saya menemukan RC yg sesuai lagi
ReplyDeletekayaknya sekarang blogger dah ngasih fitur untuk pages sepertii itu..
ReplyDeletewow, artikel ny berguna bgt nih sob.. cocok bgt bwt mnmbh wawasan ku seputar tema ini..
ReplyDeletesob, mengingt blog ni sngt bermanfaat bgt q.. tukeran link yok!!
link blog kamu sudah terpasang di blogku, link balik yach :) silahkan di liat di blogku!!
ntar pasang link ku dengan anchor text "Naruto Soundtrack" yach,
dan jdi follower q juga y, siapa thu aja dgn kehadiran blogger se-hebat kamu, blog ku bisa
sedikit rame dan berwibawa gtu.he3
ntar secara berkala q bakal sering-2 silaturahmi kesini..
d tunggu kehdirannya yach :D
salam dari blogger indonesia setengah bule.he3
makasih..
anyindia > kan udah ad itu preview-nya diatas ..di tutor.. walopun bukan preview contoh asli sih.. bisa kamu coba di blog alternatif kamu anyindia.. :)
ReplyDeletemixedfresh > oke.. silahkan saja :D
Cerita Dewasa > waaah... itu pasti ada beberapa kode script yg hilang/kurang jadinya malah error..
atau bisa juga karena disebabkan widget lainnya shingga widget RC & pelangimu jd error..
Coba dihapus dulu Script RC & Pelanginya.. lalu mulai lagi instal RC dulu.. trus dilihat berfungsi gak ?..baru instal link pelangi..
dan coba kamu ingat2 widget apa yg bru kamu instal yg bikin widget sebelumnya baik menjadi error...
krn contohnya diblogku saja.. widget Smiley komentar jd error gara2 widget follow google punyaku.. smiley-komentarnya jd gk muncul.. dan malah bikin lemot.. kekekek :D
sentraBLOG > heuum.. sub menu ya ? waah kayaknya PR lagi ini.. hehe :)
Cerita Dewasa > kayaknya udah gw FOLLOW gan.. :) ..ntar wa cek lagi..
septian > oke.. thx.. ntar wa follow balik :)
Yohan Wibisono > trims gan.. :)
Rizky2009 > oww..begitu.. mungkin terletak di script js-nya Riz..coba dicek pake notepad.. trus bandingkan dg script js RC-mu yg asli alias yg belum diubah2.. :)
toko batik online > udah adaa yaa??? :D
Naruto Soundtrack > oke...SIIIP.. TUKER LINK & TUKER FOLLOW gan.. SALAM BLOGGER INDONESIA.. ;)
nyoba dulu ah. hehe :)
ReplyDeletethanks sob, link kamu juga sudah q pasang di blog q.. dgn anchor text "Sharing Knowledge"..
ReplyDeletemksih sdh berkunjung, btw.. blog ny apik tenan.. full animasi.. really excited :D
makasih postingannya ntar sy coba dulu ok.
ReplyDeleteUdah Gue follow Braad....
ReplyDeletethya > hehe.. silahkan dicoba.. ;)
ReplyDeleteNaruto Soundtrack > oke.. siiip dech... Link mu jg sdh gw pasang dan telah wa Follow jg.. :)
pasang iklan gratis > oke.. ;)
Ganden > siiiip.... :D
This comment has been removed by a blog administrator.
ReplyDeletesob, gimana yah cara bkin blog full animasi kyk kmu.. q ngeliat ny gak bosen loh, mgkn sm dg sobat blogger yg lain.. brp lm kmu men-design blog ini secara keselurhan hingga jadiny kyk gni??
ReplyDeleteNaruto Soundtrack > oww.. yg saya lakukan adalah :
ReplyDelete1. Mencari template blog yang sesuai (ini sgt penting.. dan ini yg lama.. template itu faktor utama )..
2. Menginstal Widget yang fantastis tapi gk memberatkan..
3. Menginstal Link Pelangi.. mengubah Ukuran Text Font.. dua2nya utk MouseOver..
4. Membuat tampilan smiley Cbox lebih hidup..
5. DLL...
... Sebetulnya sudah saya Postingkan semua Cara2 yang saya terapkan di blog ini.. tinggal sahabat2 blogger lainnya saja yang mau mencobanya atau tidak ?.. :)
akan tetapi semuanya itu saya lakukan tidak secara instan... ada beberapa tahapan dulu.. seperti analisa template/ widget / JS yg saya instal... kalo bagus..ya saya pertahankan...
...begitulah kira2 secara garis besarnya gan..
semakin hebat aja nih master andi wong, sukses sll buat master
ReplyDeleteRizky2009 > makasih riz.. bisa aj kamu mujinya.. hehe.. sukses slalu jg bwt kamu Riz.. :)
ReplyDeletekk kayak mana sih gak ngerti ribet banget !!!
ReplyDelete@dunia_rizkyQ:
ReplyDelete:) ..bingung pada bagian yg mana sob.. pahami sj dulu pelan2.. jgn terburu2
mantaaaaaaaab banget infonya
ReplyDeleteterima kasih
apa sdh dicoba ?.. berhasil kagak fahrur.. :)
ReplyDeleteTHANK'S MORE INFO...:D
ReplyDelete@rebel troops:
ReplyDeleteyups.. sama2 gan..thx 4 komen
wah thnks tutorialnya.....
ReplyDeletemaklum masih newbe :D
@yuliaslovic:
ReplyDeleteyups.. silahkan dipelajari gan.. ntar lama2 kamu master jg .. ;)
bagus bos....
ReplyDelete:))
makasih atas tipsnya..
ReplyDeletedahsayat.. aku abis praktein
kalo buat percantik komen caranya gimana
aku cari-cari kok gak ada ya??
ReplyDeleteThanks atas info tutorialnya....akan segera dicoba
ReplyDeleteBOS SAYA IZIN NDELESEP PINGIN NGRESEP ILMUNE........BOS.... SAYA SANGAT BINGUNG SEKALI.... KARENA SAYA TIDAK SEDIKITPUN MENGERTI HTML..... BOLEHKAN BOS>>>> SAYA BELAJAR DISINI........ :(
ReplyDeletekang, cara nambahin kayak profile FB gitu di blog klasik gimana,mohon pencerahannya.. :D :D
ReplyDeleteWah, sangat bermanfaat sekali brade, tukeran link dong, boleh kan :), oh iya, selanjutnya, setika saya mau menulis disetiap sub2 menu itu gimana cara masukinnya brade, mungkin bisa dipahami, contohnya: ketika saya buat menu bisnis, nah sub menunya ada ikan, ayam dll, tentunya saya harus menulis ditempat yang sesuai dengan judulnya, nah, jika para pengunjung ingin mengklik setiap judul, maka akan terbuka di tab yang baru, tolong dong pencerahannya brade. :)
ReplyDeletemaaf ni saya pemain baru dalam hal membuat blog. banyak sekali yang harus saya ketehui karena blog saya jauh dari sempurna, mohon informasi / di ajarkan.....
ReplyDeleteartikelnya bagus bang saya termasuk newbie di sini makasih petunjuknya bang dijamin saya akn sering berkunjung
ReplyDeleteTerima kasih atas ilmu dan infonya. ini sangat membatu sekali bagi saya....
ReplyDeletetak coba dulu ya sob, dulu pernah nyoba tp gagal gara2 mau nambah jumlah menu nya jd eror, nah ini ada panduan buat nambah menunya thanks info nya ya
ReplyDeletekok habis ak sign in ke blog ga ada tulisan rancangannya yaa,,, jadi susah mau edit htmlnya,,,
ReplyDeleteitu templatenya ga bisa di edit saya juga pernah pakai template yg ga bisa di edit2 lagi
Deletemantap artikelnya salam kenal semua
ReplyDeletehttp://rentalmobilmakassar.blogspot.com/
wah thanks infonya saya mau tanya cara menggeser baris menunya ke tengah bagai mana yah gan ? www.photocrott.blogspot.com
ReplyDeleteSelamat malam gan, maksih dah share tenta ca di atas, langsung bisa ane praktekin di blog ane gan, www.rangga atmajaya.com dan ternyata berhasil. makasih banyak, dan ane udah follow blog ente gan, jangan lupa di follow back, kita sebagai blogger indonesia yang jujur, makasih sekali lagi.
ReplyDeleteMksh info'x gan sangat membantu sekali..
ReplyDeletegan qw dulu download template trus saya pasang
ReplyDeleteqw lht htmlx g ada gan gmn itu
eh?...apanya yg kagak ada gan, kodenya atau apa...kalau tutorial diatas memang untuk template blogcepot yang lawas...
ReplyDeleteuntuk template blogcepot yang model baru, sdh beda lagi...
kalau mau menulis isi menubar nya masih di icon pages ya?
ReplyDeletepusing juga ya kalo ngak paham
ReplyDeleteiye om, setidaknya mengerti sedikit ttg code html :)
Deletethanks banget infonya gan kunjungi juga blog saya sharingbubbler.blogspot.com
ReplyDeleteBagus ...Kunjungi http://arieenamikaze.blogspot.com/#
ReplyDeletewah keren , makasih infonya mas
ReplyDeletethanks tipsnya gan jadi blog http://buka-tips.blogspot.com/ saya jadi rapi :D hehe
ReplyDelete