Assalamualikum wr wb
kali ini saya ingin berbagi ilmu tentang car membuat menu tab seperti ini
1.Masuk ke Dasbor
2. Klik Tab Tata Letak
3. Klik Tab Edit HTML
4. Silahkan cari di dalam template anda kode ]]></b:skin>
5. Persis sebelum kode tersebut pastekan script di bawah ini
.menuhorisontal{width:100%; overflow:hidden; border-bottom:0px solid #000000;}
.menuhorisontal ul{margin:0; padding:0; padding-left:0px; font:13px Arial; list-style-type:none}
.menuhorisontal li{display:inline; margin:0}
.menuhorisontal li a{float:left; display:block; text-decoration:none; margin-right:2px; padding:2px 2px 2px 2px; color:#000000; background:#CCCCCC;}
.menuhorisontal li a:hover{color:#FFFFFF; background:#2E2EFE}
6. Klik Simpan Template.menuhorisontal ul{margin:0; padding:0; padding-left:0px; font:13px Arial; list-style-type:none}
.menuhorisontal li{display:inline; margin:0}
.menuhorisontal li a{float:left; display:block; text-decoration:none; margin-right:2px; padding:2px 2px 2px 2px; color:#000000; background:#CCCCCC;}
.menuhorisontal li a:hover{color:#FFFFFF; background:#2E2EFE}
Langkah II :
1. Masuk ke Dasbor
2. Klik Tab Tata Letak
3. Klik Tab Element Halaman
4. Klik Tambah Gadget yang berada di posisi header ( atas )
5. Klik pilihan menu HTML/JavaScript
6. Pastekan script berikut ini ke dalam kolom konten tersebut
<div style="overflow:no; width:100%px; height:100%px; padding:0px; border:0px solid #FFFFFF; background:#FFFFFF;">
<div class="menuhorisontal">
<li>
<a href="http://pinginbelajar.blogspot.com">HOME</a>
<a href="http://www.blogcatalog.com/blogs/pingin-belajar.html" target="_blank">Blog Catalog</a>
<a href="http://technorati.com/blogs/pinginbelajar.blogspot.com" target="_blank">Technorati</a>
<a href="http://feeds2.feedburner.com/PinginBelajar" target="_blank">Feed Burner</a>
<a href="http://pinginbelajar.blogspot.com/2008/12/automatic-exchange-link-columns.html" target="_blank">Exchange Link</a>
<a href="http://pinginbelajar.blogspot.com/2008/12/comment-box.html" target="_blank">Comment Box</a>
<a href="http://pinginbelajar.blogspot.com/2009/05/promosikan-blog-anda-sekarang-juga.html" target="_blank">Buruan Daftar</a>
</li>
</div>
</div>
<div class="menuhorisontal">
<li>
<a href="http://pinginbelajar.blogspot.com">HOME</a>
<a href="http://www.blogcatalog.com/blogs/pingin-belajar.html" target="_blank">Blog Catalog</a>
<a href="http://technorati.com/blogs/pinginbelajar.blogspot.com" target="_blank">Technorati</a>
<a href="http://feeds2.feedburner.com/PinginBelajar" target="_blank">Feed Burner</a>
<a href="http://pinginbelajar.blogspot.com/2008/12/automatic-exchange-link-columns.html" target="_blank">Exchange Link</a>
<a href="http://pinginbelajar.blogspot.com/2008/12/comment-box.html" target="_blank">Comment Box</a>
<a href="http://pinginbelajar.blogspot.com/2009/05/promosikan-blog-anda-sekarang-juga.html" target="_blank">Buruan Daftar</a>
</li>
</div>
</div>
7. Untuk script yang berwarna merah di atas menandakan warna latarnya, silahkan ganti dengan warna pilihan anda agar sesuai dengan warna site anda. Untuk mendapatkan variasi kode warna, silahkan terlebih dahulu surfing di sini [ html-color-codes ]
8. Silahkan ganti script URL yang berwarna kuning dengan URL milik anda
9. Silahkan ganti script yang berwarna hijau dengan kata pilihan anda
10. Klik Simpan
11. Selesai
COMMENTS :
0 komentar to “CARA MEMBUAT MENU TAB”
Posting Komentar