TutORiaL BLog's KuNit: Cara Membuat Menu Tab View yang Cakep (2)

Halluw sobat sua lagi ma Kunit hehehe , kali ini aku mau bagi-bagi ilmu lagi yaitu Cara membuat menu

Tab View yang cakep kayak punyaku itu tuch ,,, ^^

Langsung aja yak,,, ikuti langkah-langkahnya , yang teliti and telaten biar berhasil, Oke ^_~

1. Login ke blogger dengan ID sobat

2. Lalu Klik Menu Templates
3. Klik Sub Menu Edit HTML
4. Pada Kotak Edit HTML cari Kode ]]></b:skin>
5. Lalu Copy Kode berikut dan Pastekan diatas kode ]]></b:skin>

/* tab model 2 ateonsoft.com */ div.Tabateonsoft div.TFs {height: 30px; overflow: hidden;} div.Tabateonsoft div.TFs a {float: left; display: block; text-align: center; text-decoration: none; font: normal 12px arial; padding:3px 5px 3px 3px; margin:0 5px 0 0;letter-spacing:-0.07em; background:#f0f0f0; color: #333; border-top:1px solid #CCCCCC; border-right:1px solid #999999; border-bottom:1px solid #999999; border-left:1px solid #cccccc; -moz-border-radius-bottomright: 10px; -moz-border-radius-topright: 10px; } div.Tabateonsoft div.TFs a:hover { background: #E8E8E8; border-top:1px solid #999999; border-right:1px solid #cccccc; border-bottom:1px solid #cccccc; border-left:1px solid #999999;} div.Tabateonsoft div.TFs a.Active { background: #E8E8E8; color: #000000; border-top:1px solid #999999; border-right:1px solid #cccccc; border-bottom:1px solid #cccccc; border-left:1px solid #999999; font-weight:bold;} div.Tabateonsoft div.Pages { clear: both; overflow: hidden; height:240px; border:1px solid #EFF0F1; padding:0;background: #ffffff; -moz-border-radius:5px;} div.Tabateonsoft div.Pages div.Page {height: 100%;padding: 0px; overflow: hidden; } div.Tabateonsoft div.Pages div.Page div.floor { font-size:11px;padding: 3px 5px; text-align:left;}</div>

6. Lalu letakkan kode berikut dibawah kode <head>

7. Save Template
8. Pergi ke halaman Element Halaman
9. Klik Add Widget Element
10. Pilih Menu HTML/Java Script
11. Lalu Copy kode berikut

Lalu pastekan itu kode di kolom HTML/Java Script yang tersedia tadi dan sekarang tinggal diSave dan disetting sesuai dengan kreatifitas dan keinginan para sobat, dan lihat hasilnya.

Semoga berhasil...

TutORiaL BLog's KuNit

Home

Sabtu, 19 Februari 2011

Cara Membuat Menu Tab View yang Cakep (2)

Tidak ada komentar:

Posting Komentar