Horizontal Tab Menu di BloGGeR Baru yang akan kita bahas
untuk pertama kali ini adalah bagaimana cara membuat tab horizontal dengan
memanfaatkan kode css bawaan blogger baru, sehingga desain tab ini bisa dibuat
sesuai harapan blogger, atau setidak-tidaknya kita bisa melakukan beberapa
perubahan pada variabel pembentuk tab hingga bisa mendekati hasil optimal.
Sebelum berlanjut pada teknik pembuatan horizontal tab sederhana ini, sebaiknya kita pahami dulu beberapa hal yang berkaitan dengan pemanfaatan tab bawaan ini.
- Kode
HTML Tabs Horizontal : Horizontal Tabs Blogger Baru hanya menggunakan
kode CSS murni tanpa melibatkan javascript.
- Simple
atau Sederhana : Karena hanya menggunakan kode CSS yang sangat
terbatas, maka bentuk tabs menjadi sangat sederhana.
- Posisi :
Hanya dapat di tempatkan di bagian bawah header (crosscol).
- Perubahan
Variabel Tab Horizontal
Beberapa perubahan variabel tab dapat dilakukan dalam template atau melalui:
Perancang Template Baru!/Template Designer New! --> Advanced--> Teks Tab/Tabs Text dan Latar Tab/Tabs Background.
- Tidak
dapat di buat di atas header dan footer (can not be created on top
header and footer).
Kode Pembentuk Tab Horizontal
<ul>
<li><a href="Link-1">Nama Link-1</a></li>
<li><a href="Link-2">Nama Link-2</a></li>
<li><a href="Link-3">Nama Link-3</a></li>
<li><a href="Link-4">Nama Link-4</a></li>
<li><a href="Link-5">Nama Link-5</a></li>
<li><a href="Link-6">Nama Link-6</a></li>
</ul>
<li><a href="Link-1">Nama Link-1</a></li>
<li><a href="Link-2">Nama Link-2</a></li>
<li><a href="Link-3">Nama Link-3</a></li>
<li><a href="Link-4">Nama Link-4</a></li>
<li><a href="Link-5">Nama Link-5</a></li>
<li><a href="Link-6">Nama Link-6</a></li>
</ul>
Catatan/Keterangan
- Link-1
diisi dengan URL yang diambilkan dari label/categories atau dari daftar
posting/posts list, seperti :
- http://www.blogger.com/posts.g?blogID=5154686636804131392&searchType=ALL&txtKeywords=&label=Modifikasi+Blog+BloGGer+Baru, atau
- http://gubhugreyot.blogspot.com/2010/07/cara-merubah-ukuran-tag-cloud-cumulus.html - Nama
Link di ambilkan dari link yang digunakan di atas. contoh :
- Modifikasi BloGGer Baru, atau
- Cara Merubah Ukuran Tag Cloud Cumulus Full Color. - Untuk
merubah warna dan ukuran font (font-color,font-size) serta latar tabs atau
tabs background silahkan masuk ke linkPerancang Template Baru!/Template
Designer New! --> Advanced--> Teks
Tab/Tabs Text dan Latar Tab/Tabs Background
Tidak ada komentar:
Posting Komentar