Cara Mengedit Menu Drop Down Bawaan Template

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.
Cara Mengedit Menu Drop Down Bawaan Template
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 !!!
Cara Mengedit Menu Drop Down Bawaan Template

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

53 Responses to "Cara Mengedit Menu Drop Down Bawaan Template"

  1. wah sangat bermanfaat ini, terimaksih sudah berbagi

    ReplyDelete
  2. Kunjugan Rutin Sobat....

    Jangan Lupa Berkunjung Di Blog Saya Ya..

    ReplyDelete
  3. OK sob,,makasih atas kunjungan dan komentarnya sob....

    ReplyDelete
  4. KALO BIAR DI MENU TERSEBUT ADA ISINYA GIMANA CARANYA MIN

    ReplyDelete
  5. cara mengaktifkan ya gimana gan ?? makasih

    ReplyDelete
  6. Terima kasih atas infonya yang sangat berguna. sebuah tutorial yang cukup bisa dimengerti oleh orang awam seperti saya. Salam.

    ReplyDelete
  7. sangat bermanfaat tipsnya gan, izin pakai ya

    ReplyDelete
  8. iya sama-sama...thanks juga kunjungan dan komentarnya.......

    ReplyDelete
  9. thanks gan jangan lupa mampir ke blog ane!!

    ReplyDelete
  10. Mau naya kalau, njadiin dropmenu menjadi menu biasa gimana (yang bukan dropmenu), Thanks :D

    ReplyDelete
  11. sudah saya praktekan gan....tapi masih nyicil ni ganti nya...kalo banyak2 takut salah hehe...maklum newbie....makasih gan

    ReplyDelete
  12. Pram@ untuk membuat menu tanpa drop down, sobat bisa lihat dibagian no.9, nah disitu sobat bisa menambahkan menu tanpa drop down,,,

    semoga artikel ini dapat membantu sobat semua ya :)

    ReplyDelete
  13. Artikel yang sangat bermanfaat!

    ReplyDelete
  14. Itu tidak pakai kode css lagi ya mas.

    ReplyDelete
  15. kalau templatenya bukan dari situs yang agan sarankan bagaimana, apakah cara di atas bisa digunakan juga mas?

    ReplyDelete
  16. Cara ngambil url link bagaiman c, bang?? Ane mau nambah menu contact us kagak jadi2.. :(

    ReplyDelete
  17. Mksh Ya ,, sanggat bermanfaat..
    Follow back. makho-manda.blogspot.com

    ReplyDelete
  18. thank's ...

    coba mas.. gimna cara ngisi artikel untk drop menu

    jazallahu ahsanal jaza

    ReplyDelete
  19. makasih bangrt yah, aku sukses ngeditnya...

    ReplyDelete
  20. kalau menon aktifkan menu drop downnya gimana ya

    ReplyDelete
  21. infonya 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.

    ReplyDelete
  22. MAKASIH INFONYA MENARIIKK...
    AYOWW.. BERKUNJUNG KE BLOG KUU...
    WWW.EXPRESSCELLULAR.BLOGSPOT.COM
    WWW.NANARIANI300.BLOGSPOT.COM

    ReplyDelete
  23. Bismillah.
    bagaimana kalau kita mau membuat drop menu pada setiap sub menu.... mohon penjelasannya.

    ReplyDelete
  24. maksud saya.. setiap drop menu memiliki sub menu
    DOWNLOAD (nama menu)
    > REKAMAN (drop dari Download)
    >> VIDEO (drop dari rekaman)
    >EBOOK (drop dari download)
    >> RELIGI (drop dari ebook)
    dan seterusnya

    ReplyDelete
  25. nuhun pisan bermnafaat saya newbie kunjungi juga http://bisaspeak.blogspot.com/mnta msukannya :D

    ReplyDelete
  26. wah makasih yah kaka.. info ini membantu sekali. akhirnya dropdown bawaan bisa di edit. hehehehehe

    ReplyDelete
  27. makasih gan, ini ane juga baru ganti template blog ane (terataiputih21.blogspot.com) tapi pusing ngedit dropdownnya. banyak bgt

    ReplyDelete
  28. thanks sob infonya..sangat bermamfaat......http://perlengkapaninternetmarketer.blogspot.com

    ReplyDelete
  29. Manteep sob artikelnya :)
    Ijin share http://pengobatanalamimustajab.com/cara-melangsingkan-tubuh-setelah-melahirkan/

    ReplyDelete
  30. posting ini lumayan lama ya sob, tapi bermanfaat sampai saat ini, terima kasih aja pokoknya

    ReplyDelete
  31. Izin share ka, terimakasih :)
    http://goo.gl/21T1Mx
    http://goo.gl/mgBCnM
    http://goo.gl/zxbefd

    ReplyDelete
  32. sekali praktek langsung bisa makasih

    ReplyDelete
  33. Kl mrubah stylenya gimana gan, sy ingin menu dropdownx vartikel kyk di gmbar postingan agan.
    kunjungi untuk gcek gak.. kl da solusi tlong kasi tau. thanks before gan for your info.
    http://fauzan-bachrie.blogspot.com/

    ReplyDelete
  34. sob gmana caranya munculin sub menu yang ketutup soal punyaku tdk klihatan sub menunya..

    ReplyDelete
  35. bermanfaat se x artikelnya, lngsung saya terapkan dan berhasil...thanxs

    ReplyDelete
  36. mantabbbbb gan sangat membantuuuuu se x
    kunjangan balik gan http://penawisata.blogspot.com/

    ReplyDelete
  37. Makasih gan sangat membantu ... jangan lupa berkunjung :

    http://deristourtravel.blogspot.co.id/

    ReplyDelete
  38. ijin share blog anda, untuk tugas ngeblog ya.. terimakasih

    ReplyDelete
  39. wah dapat info baru nih ,,,,terimakasih gan smoga bermmanfaat .

    ReplyDelete