Cara menambahkan menu drop down ke blogger dengan mudah

Sebuah fitur utama yang hilang di blogger adalah drop-down dan meskipun memungkinkan Anda untuk menggunakan tab, Anda masih sangat terbatas dalam merancang itu. Aturan praktis yang baik adalah untuk selalu memiliki salinan tempelate anda sebelum melakukan perubahan. Anda dapat mendownload tempelate Anda dengan masuk ke {Desain> Edit HTML}. Saya akan menunjukkan langkah demi langkah instruksi termudah bagi orang yang tidak mengerti tentang css atau hanya pemula. Ada sebuah situs yang disebut http://pixopoint.com, dan berkat website ini, memungkinkan Anda untuk membuat drop down dalam langkah sangat mudah dan dengan keinginan Anda sendiri! Setelah itu, Anda akan dapat menyesuaikan drop down bagaimanapun Anda suka dan sangat lurus ke depan. Anda dapat menggunakan kode warna untuk melihat kode yang akan digunakan untuk apa warna (Jangan paste, # tanda hanya nomor). Setelah Anda melakukan semua yang anda ingin selanjutnya pilih SUBMIT DESAIN, dan Anda akan diberikan preview bagaimana drop down menu akan terlihat seperti.

Setelah mengirimkan desain Anda, Anda akan diberikan daftar kode css di bagian bawah halaman. Ini akan menjadi desain drop down. Salin kode css, go to {Desain> Edit HTML} dan paste kode sebelum tag dibawah. (Gunakan Ctrl + F dan masukkan kode tersebut di dalam dan Anda akan merasa lebih cepat). ]]></b:skin>

Setelah menyisipkan kode simpanlah template Anda. Sekarang sebelum benar-benar memasukkan HTML untuk drop down kita, trik rapi yang harus dilakukan adalah menghapus semua css dari tab bar navigasi kita yang dimasukkan ke dalam tempelate blogger baru. Dengan cara ini ketika Anda menambahkan HTML antara header Anda dan pos, drop down menu tidak akan rusak dan juga itu akan ditempatkan tepat di bawah header. Untuk melakukan ini sekali lagi kita akan masuk (Desain> Edit HTML) dan mencari tag / * Tabs dan kemudian hapus semua yang ada di dalam tag. Pastikan untuk tidak menghapus apa pun sehingga Anda tidak akan merusak blog Anda.

Sekarang itu selesai, kita bisa mulai memasukkan HTML sehingga kita benar-benar dapat membuat drop down menu bekerja. masuk Ke (Design> Page Elements) dan kemudian "Add Gadget". Di sinilah Anda masukkan HTML dasar Anda di bawah ini.

___________________________________________________________________________ <!--[if lte IE 7]> <script type="text/javascript" src="http://pixopoint.com/wp-content/plugins/pixopointmenu/scripts/suckerfish_ie.js"></script> <![endif]--> <ul id="suckerfishnav" class="sf-menu"> <li><a href="#">Link 1</a></li> <li><a href="#">Link 2</a> <ul> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> </ul> </li> <li><a href="#">Link 3</a> <ul> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> </ul> </li> <li><a href="#">Link 4</a> <ul> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> <li><a href="#">Sub link</a></li> </ul> </li> </ul> ___________________________________________________________________________
Setelah Anda menambahkan HTML, Anda dapat mulai mengeditnya sesuai keinginan Anda sendiri. "Link" adalah menu navigasi kepala, "Sub link" akan menjadi drop down kita, dan "#" akan menjadi link yang akan mengarahkan menu. Namun Anda akan melihat sesuatu yang salah dengan menu drop down. Anda akan melihat bahwa drop-down menu baik pergi ke balik posting Anda atau menu tidak

dapat melayang ke bawah dengan mouse, dan ada perbaikan yang sangat sederhana untuk masalah ini. masuk Ke (Design> HTML) dan cari tag yang di bawah ini # suckerfishnav ul. position:absolute; Tepat setelah koma mutlak tambahkan tag berikut: z-index:100;

Tag ini akan memastikan bahwa menu melayang anda akan ditampilkan di atas segala sesuatu yang lain, tetapi tidak untuk internet explorer 7-up! Script sebelum HTML drop down kami benar-benar perbaikan gangguan lagi dari menu drop down untuk IE, tapi sayangnya sebagian orang drop down menu akan melayang di balik sumbernya, dan memperbaiki dgn baik,, untuk ini tambahkan tag berikut pada akhir dari HTML: <br> dan Anda ingin memastikan untuk menambahkan sebanyak tersebut sampai spasi antara drop-down menu dan post selama drop down, sehingga tidak akan bersembunyi di balik pos. perbaikan lain yang akan ingin diterapkan dalam hal menyingkirkan menu lengket ketika dia melayang di IE adalah masuk ke (Design> Template Designer> advanced> add css) di sini Anda akan menambahkan kode berikut, #suckerfishnav li:hover, #suckerfishnav li.hover { position:static; }

Enjoy..