Menampilkan Tab Horizontal di Blogger Baru

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.

1. Kode HTML Tabs Horizontal : Horizontal Tabs Blogger Baru hanya menggunakan kode CSS murni tanpa melibatkan javascript.
2. Simple atau Sederhana : Karena hanya menggunakan kode CSS yang sangat terbatas, maka bentuk tabs menjadi sangat sederhana.
3. Posisi : Hanya dapat di tempatkan di bagian bawah header (crosscol).
4. 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.
5. 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>

Catatan/Keterangan

1. 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
2. Nama Link di ambilkan dari link yang digunakan di atas. contoh :
   - Modifikasi BloGGer Baru, atau
   - Cara Merubah Ukuran Tag Cloud Cumulus Full Color.
3. Untuk merubah warna dan ukuran font (font-color,font-size) serta latar tabs atau tabs background silahkan masuk ke link Perancang Template Baru!/Template Designer New! --> Advanced --> Teks Tab/Tabs Text dan Latar Tab/Tabs Background

Categories: Totorial Blogging