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.
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>
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 link Perancang Template Baru!/Template Designer New! --> Advanced --> Teks Tab/Tabs Text dan Latar Tab/Tabs Background
mas code yang di atas di taru di bagian mana mas
BalasHapusTab menu Vertikal gemana?............ Thanks
BalasHapusOm!, Vertikal sudah ketemu, bagaimana ingin nambah cabang dari bagian satu persetu ....... thanks!, moga sehat dan baik selalu!.
BalasHapusbingung aq maz..
BalasHapusbagus sih cma ak bngung mau ngrubah link 1 jadi daftar menu d blog ak
BalasHapusmakasih infonya
BalasHapuswww.amirzona.blogspot.com
Bagus nih tutorialnya. Terima kasih banyak ya untuk ilmunya yang pernting
BalasHapussemoga blog nya semakin bertambah terkenal.
ohya, saling berkunjung juga ya
Untuk sekadar silaturahmi antar sesama blogger
salam kawan