Assalamualaikum sobat,,,
Cara Mengedit Menu Drop Down Bawaan Template
Halo sobat semua, bertemu lagi di ruang hangat Remaja Sampit. Kali ini saya akan berbagi tips Cara mengedit Drop Down Menu Horizontal bawaan sebuah template. Mungkin cara ini cukup mudah bagi para sobat yang udah mahir mengoprek-oprek Template blog, tapi cukup sulit dan membingungkan bagi sobat yang baru saja terjun ke dunia Blogger. Memang banyak dari sobat blogger newbie yang kebingungan mengedit Daftar di Menu Drop Down. Jika sobat mendownload template yang memiliki Menu Drop Down, dan memasangnya di blog sobat, maka daftar menu di template tersebut adalah Default dari template itu. Nah ,, disini saya akan memberi informasi Cara merubah daftar tersebut sesuai dengan keinginan kita.
Sobat bisa menambah Menu Baru tanpa drop down, bisa juga menambah menu baru dengan fungsi Drop Down. Selain menambah, sobat juga bisa mengurangi menu, jika terasa berlebihan. Cara ini saya rangkum cukup praktis, agar sobat bisa mengikutinya dengan mudah.
OK , sebagai sempel, disini saya akan mengdit template yang saya download di ZOOMTEMPLATE, bagi sobat yang kebingungan mencari template yang keren-keren, langsung aja mampir di ZOOMTEMPLATE. Disini saya menggunakan Browser Google Chrome, agar lebih mudah. Penampakan pertama sebelum Menu saya edit adalah seperti gambar dibawah ini :
Sekarang kita akan mengedit menu tersebut sesuai dengan keinginan kita. Bersiap-siap untuk mulai mengutak atik code-code di HTML.Sebelumnya Upload dulu template baru sobat. Bagi sobat yang belum tau cara mengupload Template baru di Blog, bisa sobat baca tutorialnya disini !
1. Langsung aja sobat Login ke Blogger
2. Pilih Template
3. Pilih Edit HTML
4. Beri centang pada ‘’ Expand Template Widget’’ pada pojok kiri atas
5. Tekan Ctrl+F untuk memudahkan pencarian kode.
6. Perhatikan pada salah satu daftar menu di dalam menu drop down tersebut, Misalkan disitu ada daftar ‘’Business’’. Ketikan kata ‘’Business’’ pada kotak pencarian dan tekan enter, maka akan muncul di daftar HTML code dengan tulisan ‘’Business’’. Sobat bisa menggunakan salah satu dari daftar menu tersebut, terserah mau pake yang mana. Setelah kita mendapatkan kode tersebut, maka kita sudah menemukan posisi seluruh kode yang mengatur menu drop down itu. Nah disinilah sobat akan mulai mengeditnya sesuai dengan keinginan sobat. Lihat Gambar di bawah ini untuk memperjelas.
7. Merubah Judul Menu. Disini saya contohkan, akan merubah nama ‘’Business’’ menjadi ‘’Remaja Sampit’’. Maka code Business saya hapus dan saya Ganti dengan kode Remaja Sampit.
8. Menghapus Menu. Untuk menghapus menu, sobat tinggal memblok seluruh kode yang di mulai dari kode <li> dan di akhiri dengan kode </ul></li>. Untuk leboh jelasnya sobat bisa melihat gambar di bawah ini.
9. Menambah Menu. Kaitannya dengan penambahan menu, sobat bisa menambah Menu tanpa drop down, Menambah menu dengan 1 drop down, dan Menambah menu dengan 2 drop down. Perhatikan dengan teliti pada bagian penambahan menu ini.
Penambahan menu tanpa dorp down.
Tambahkan kode di bawah ini. Dan letakan di antara kode sebelum dan sesudahnya.
<li><a href='#'>Menu Baru</a>
</li>
Untuk lebih jelas, lihat gambar !!!
Penambahan menu dengan 1 drop down.
Tambahkan kode di bawah ini. Dan letakan di antara kode sebelum dan sesudahnya.
<li><a href='#'>Menu Baru</a>
<ul class='children'>
<li><a href='#'>Drop Down 1a</a></li>
<li><a href='#'>Drop Down 1b</a></li>
</ul>
</li>
Kode ‘’Menu Baru, Drop Down 1a, Drop Down 1b’’ bisa sobat ganti sesuai dengan judul menu yang diinginkan. Untuk lebih jelas, lihat gambar !!!
Penambahan menu dengan 2 drop down.
Tambahkan kode di bawah ini. Dan letakan di antara kode sebelum dan sesudahnya.
<li><a href='#'>Menu Baru</a>
<ul class='children'>
<li><a href='#'>Drop Down 1a</a>
<ul class='children'>
<li><a href='#'>Drop Down 2a</a></li>
<li><a href='#'>Drop Down 2b</a></li>
<li><a href='#'>Drop Down 2c</a></li>
</ul>
</li>
<li><a href='#'>Drop Down 1b</a></li>
</ul>
</li>
Untuk lebih jelas, lihat gambar !!!
10. memberi alamat link di setiap judul menu. Setiap kode yang bersimbol “#’’ merupakan tempat sobat menyimpan link yang bisa mengarahkan judul blog menuju link tersebut. Untuk pemasangannya, sobat hapus tanda # dan ganti dengan URL link yang sobat inginkan. Tanda petiknya jangan di hapus ya!!! Conoth ‘’#’’ menjadi ‘’ http://remajasampit.blogspot.com/’’.
Kalo sobat merasa sudah selesai mengedit, sobat bisa menyimpannya dengan menekan tombol Simpan Template pada bagian bawah. Dan lihat hasilnya...... ok soba,, mungkin hanya itu sedikit informasi sederhana yang bisa saya berikan, apabila ada pertanyaa, silahkan isi di kotak komentar, dan InsyaAllah jika saya bisa membantu, akan saya beri solusinya. Semoga informasi tadi dapat memberikan manfaat bagi sobat semua. Terima kasih atas kesediaan sobat yang telah membaca artikel yang berjudul ‘’Cara Mengedit Menu Drop Down Bawaan Template‘’ ini.
Tag : Cara Mengedit Menu Drop Down Bawaan Template
wah sangat bermanfaat ini, terimaksih sudah berbagi
ReplyDeleteOK sob,,makasih atas kunjungan dan komentarnya sob....
ReplyDeleteKALO BIAR DI MENU TERSEBUT ADA ISINYA GIMANA CARANYA MIN
ReplyDeletethanks gan wat info nya.
ReplyDeletecara mengaktifkan ya gimana gan ?? makasih
ReplyDeleteTerima kasih atas infonya yang sangat berguna. sebuah tutorial yang cukup bisa dimengerti oleh orang awam seperti saya. Salam.
ReplyDeletesangat bermanfaat tipsnya gan, izin pakai ya
ReplyDeletethank pak. sanagt membantu
ReplyDeleteiya sama-sama...thanks juga kunjungan dan komentarnya.......
ReplyDeleteterimakasih..
ReplyDeletethanks gan jangan lupa mampir ke blog ane!!
ReplyDeleteMau naya kalau, njadiin dropmenu menjadi menu biasa gimana (yang bukan dropmenu), Thanks :D
ReplyDeletesudah saya praktekan gan....tapi masih nyicil ni ganti nya...kalo banyak2 takut salah hehe...maklum newbie....makasih gan
ReplyDeletePram@ untuk membuat menu tanpa drop down, sobat bisa lihat dibagian no.9, nah disitu sobat bisa menambahkan menu tanpa drop down,,,
ReplyDeletesemoga artikel ini dapat membantu sobat semua ya :)
Artikel yang sangat bermanfaat!
ReplyDeletekeren banget gan
ReplyDeleteterima kasih ilmunya :)
ReplyDeleteTerima Kasih ..:-)
ReplyDeleteItu tidak pakai kode css lagi ya mas.
ReplyDeletekalau templatenya bukan dari situs yang agan sarankan bagaimana, apakah cara di atas bisa digunakan juga mas?
ReplyDeleteCara ngambil url link bagaiman c, bang?? Ane mau nambah menu contact us kagak jadi2.. :(
ReplyDeleteMksh Ya ,, sanggat bermanfaat..
ReplyDeleteFollow back. makho-manda.blogspot.com
thank's ...
ReplyDeletecoba mas.. gimna cara ngisi artikel untk drop menu
jazallahu ahsanal jaza
makasih bangrt yah, aku sukses ngeditnya...
ReplyDeletetank gan
ReplyDeletesangat membantu
kalau menon aktifkan menu drop downnya gimana ya
ReplyDeletegood artikel
ReplyDeletemakasih gan informasinya (y)
ReplyDeleteinfonya menarik dan berhasil saya terapkan, meskipun dalam mengedit dropdown menu terkadang sering terjadi error karena tidak mengerti maksud dari kode kode yang jujur membuat saya bingung, tetapi alhamdulillah dengan artikel ini saya bisa mengedit sendiri sesuai dengan keinginan,, untuk temen temen yang lain sebaiknya preview dulu dan back up template sebelum diedit.
ReplyDeleteMAKASIH INFONYA MENARIIKK...
ReplyDeleteAYOWW.. BERKUNJUNG KE BLOG KUU...
WWW.EXPRESSCELLULAR.BLOGSPOT.COM
WWW.NANARIANI300.BLOGSPOT.COM
Bismillah.
ReplyDeletebagaimana kalau kita mau membuat drop menu pada setiap sub menu.... mohon penjelasannya.
maksud saya.. setiap drop menu memiliki sub menu
ReplyDeleteDOWNLOAD (nama menu)
> REKAMAN (drop dari Download)
>> VIDEO (drop dari rekaman)
>EBOOK (drop dari download)
>> RELIGI (drop dari ebook)
dan seterusnya
nuhun pisan bermnafaat saya newbie kunjungi juga http://bisaspeak.blogspot.com/mnta msukannya :D
ReplyDeletewah makasih yah kaka.. info ini membantu sekali. akhirnya dropdown bawaan bisa di edit. hehehehehe
ReplyDeletemakasih gan, ini ane juga baru ganti template blog ane (terataiputih21.blogspot.com) tapi pusing ngedit dropdownnya. banyak bgt
ReplyDeletethanks sob infonya..sangat bermamfaat......http://perlengkapaninternetmarketer.blogspot.com
ReplyDeleteManteep sob artikelnya :)
ReplyDeleteIjin share http://pengobatanalamimustajab.com/cara-melangsingkan-tubuh-setelah-melahirkan/
sangat bermanfaat .. makasih sobb
ReplyDeleteposting ini lumayan lama ya sob, tapi bermanfaat sampai saat ini, terima kasih aja pokoknya
ReplyDeleteIzin share ka, terimakasih :)
ReplyDeletehttp://goo.gl/21T1Mx
http://goo.gl/mgBCnM
http://goo.gl/zxbefd
sekali praktek langsung bisa makasih
ReplyDeleteKl mrubah stylenya gimana gan, sy ingin menu dropdownx vartikel kyk di gmbar postingan agan.
ReplyDeletekunjungi untuk gcek gak.. kl da solusi tlong kasi tau. thanks before gan for your info.
http://fauzan-bachrie.blogspot.com/
sob gmana caranya munculin sub menu yang ketutup soal punyaku tdk klihatan sub menunya..
ReplyDeletebermanfaat se x artikelnya, lngsung saya terapkan dan berhasil...thanxs
ReplyDeletemantabbbbb gan sangat membantuuuuu se x
ReplyDeletekunjangan balik gan http://penawisata.blogspot.com/
Makasih gan sangat membantu ... jangan lupa berkunjung :
ReplyDeletehttp://deristourtravel.blogspot.co.id/
terima kasih informasinya :)
ReplyDeleteijin share blog anda, untuk tugas ngeblog ya.. terimakasih
ReplyDelete