Assalamualaikum wr wb
Bismilah Hirohman Nirohim
Salam Belogger ..
pada kesempatan kali ini Software Komputer akan memberikan Penjelasan tentang Cara dahsyat membuat menu horizontal keren dan bagus di Blog , kali ini saya akan memberikan sebuah penerangan bagi para blogger yang
masih newbie, tentang bagaimana cara membuat menu navigasi . dari pada punya ilmu dipendam aja, mending kita bagikan kan?.
O.k sekarang kita ikuti langakah demi langkah demi tercapainya sebuah tujuan yang muliaKode CSS:
/* Navigasi tabs Sederhana buka-rahasia.blogsot.com Starts */Kode HTML:
a.burastabs, a.burastabs:link, a.burastabs:visited {display:block; width:102px; height:30px; background:#444444; border:1px solid #ebebeb; margin-top:2px; text-align:center; text-decoration:none; font-family:arial, sans-serif; font-size:12px; font-weight:bold;color:#FFFFFF; line-height:25px; overflow:hidden; float:left;}
a.burastabs:hover {color:#FFFFFF; background:#666666;}
#burasbar {width:auto; margin:0 auto;}
/* Navigasi tabs Sederhana Ends */
<!-- Navigasi tabs Sederhana http://buka-rahasia.blogspot.com Starts -->
<div id='burasbar'>
<a href="#" class="burastabs">Home</a>
<a href="#" class="burastabs">About</a>
<a href="#" class="burastabs">Blog Tips</a>
<a href="#" class="burastabs">SEO Tips</a>
<a href="#" class="burastabs">Contact</a>
<a href="#" class="burastabs">Sitemap</a>
<a href="#" class="burastabs">Advertise</a>
</div>
<!-- Navigasi tabs Sederhana Ends -->
Sebelumnya copy & edit terlebih dahulu kode HTML di atas. Ganti # dengan URL yg dikehendaki. Ganti juga Home, Blog Tips, SEO Tips, dan seterusnya dengan anchor text yg diinginkan. Untuk menambah atau mengurangi tab, copy/tambahkan atau hapus bagian <a href="#" class="burastabs">Anchor Text</a> di atas </div>.
Cara Membuat Menu Horizontal Tabs Sederhana di Blogger/Blogspot:
1. Masuk ke Dashboard > Design/Rancannga > Edit HTML.
2. Copy kode CSS di atas,
4. Cari ]]></b:skin> (cari dengan Ctrl + F) & letakkan/paste Kode CSS tepat di atasnya. 5. Save Template.
6. Masuk ke Page Elements > Klik Add a Gadget
7. Setelah pop up window muncul, pilih opsi HTML/Javascript
8. Masukkan Kode HTML yg telah diedit tadi pada kolom seperti contoh berikut:
9. Klik save.
10. Drag/geser widget menu horizontal tersebut ke bawah/atas header (letakkan pada slot gadget) dan save lagi. DOnE!
Oke itulah Sekilas Cara dahsyat membuat menu horizontal keren dan bagus di blog kali ini yang bisa saya sampaikan tentang
semoga bermanfaat buat semuanya, jika ada kekurangan mohon dimaafkan
karena saya disini masih sama-sama belajar dan atas perhatiannya saya
ucapka terima kasih,.
Waalaikumsalam wr wb
No comments:
Post a Comment