Cara Membuat Menu di Blogspot

Cara Membuat Menu di Blogspot 

B eberapa waktu yang lalu aku sudah pernah menyajikan artikel tentang cara membuat menu di blogspot, jika tidak percaya silahkan sobat buka tautan link berikut cara membuat menu drop down di blogspot. Tetapi kali ini sedikit berbeda dari segi cara pemasangan serta tampilannya,dengan menu sebelumnya. Dimana menu-menu yang telah terpasang nantinya tidak akan terbuka secara drop down ketika tersentuh oleh kursor. Ya, hanya tersusun horizontal setiap sebuah menu baru telah ditambahkan.

Dari segi pembuatan serta pemasangannya pun jelas berbeda, tidak seperti pembuatan menu sebelumnya dimana terdapat 2 buah kode yakni kode CCS dan HTML yang harus terpasang dalam template blog, kali ini cukup menggunakan sebuah kode HTML saja yang perlu sobat pasang kedalam gadget HTML. Baiklah, tanpa berpanjang lebar lagi berikut adalah langkah-langkah cara pembuatannya.

Cara Membuat Menu di Blogspot.com

• Login kedalam dasbor blogspot sobat. 

• Kemudian pilih Tata Letak. 

• Pilih Add a gadget/ tambahkan gadget. 

• Pilih HTML 

• Kemudian copy dan pastekanlah kode untuk membuat menu yang berada di bawah ini, kedalam gadget HTML tersebut.

<style type='text/css'>.menulink{ text-decoration:none;color:#ffffff;font-size:13px;} </style><span style='font-family: Arial, helvetica, sans-serif;'>
<table border='2' bordercolor='#ffffff' cellpadding='' cellspacing='0' style='border-collapse: collapse; height: 56px; width: 980px;'><tbody>
<tr>
<td align='center' bgcolor='#505D7A' onclick='javascript:location.href=&apos;#&apos;' onmouseout='style.backgroundColor=&apos;#505D7A&apos;' onmouseover='style.backgroundColor=&apos;#5D6B8D&apos;'><a class='menulink' href='#' onmouseout='style.color=&apos;#E0E55C&apos;' onmouseover='style.color=&apos;#f0f0f0&apos;'>Home
</a> </td>
<td align='center' bgcolor='#505D7A' onclick='javascript:location.href=&apos;#&apos;' onmouseout='style.backgroundColor=&apos;#505D7A&apos;' onmouseover='style.backgroundColor=&apos;#5D6B8D&apos;'><a class='menulink' href='#' onmouseout='style.color=&apos;#E0E55C&apos;' onmouseover='style.color=&apos;#f0f0f0&apos;'>Archive</a></td>
<td align='center' bgcolor='#505D7A' onclick='javascript:location.href=&apos;#&apos;' onmouseout='style.backgroundColor=&apos;#505D7A&apos;' onmouseover='style.backgroundColor=&apos;#5D6B8D&apos;'><a class='menulink' href='#' onmouseout='style.color=&apos;#E0E55C&apos;' onmouseover='style.color=&apos;#F0F0F0&apos;'>Wallpaper</a></td>
<td align='center' bgcolor='#505D7A' onclick='javascript:location.href=&apos;#&apos;' onmouseout='style.backgroundColor=&apos;#505D7A&apos;' onmouseover='style.backgroundColor=&apos;#5D6B8D&apos;'><a class='menulink' href='#' onmouseout='style.color=&apos;#E0E55C&apos;' onmouseover='style.color=&apos;#F0F0F0&apos;'>Tutorials</a></td> </tr>
</tbody></table>
</span>

Keterangan: untuk merubah lebar serta tinggi tampilan menu, silahkan untuk merubah masing-masing angka yang tercetak tebal serta berwarna merah. 

• Terakhir pilih simpan gadget dan selesai.!

Hasilnya akan terlihat seperti dalam gambar berikut ini: 

Demikianlah cara membuat menu di blogspot, semoga bermanfaat untuk sobat semua.

Bye-bye...