Lompat ke konten Lompat ke sidebar Lompat ke footer

Widget HTML #1

Membuat Label Cloud Blog Menjadi Warna-Warni

Label adalah untuk mengkategorikan dan penanda tulisan yang diposting di blog. Blogger.com sendiri sudah menyediakan gadget (widget) untuk menampilkan label dalam bentuk cloud yaitu ukuran font berbeda-beda. Label yang sudah kita buat, sesuai dengan isi postingan bisa menjadi menu di blog kita. Menu adalah sebuah navigasi untuk mempermudah penelusuran postingan.

Masih ingat dulu, blogger belum memberikan fitur Label Cloud, masih berberuk daftar atau list. Sehingga untuk menampilkan label menjadi bentuk Cloud yang biasanya sering ditemui di blog yang berplatform wordpress harus mengedit template. Bahkan untuk membuat label menjadi lebih menarik ada yang menampilkannya menjadi bentuk animasi flash atau blogumulus.

Nah sekarang, kita akan belajar untuk membuat label cloud yang warna-warni. Label akan ditampilkan dalam ukuran font yang berbeda tiap labelnya juga dengan warna yang berbeda-beda. Dengan warni-warni tentu akan membuat blog lebih berwarna dan menarik, selain itu menampilkan label membuat pengunjung lebih mudah menelusuri setiap halaman di blog kita.


Cara Membuat Label Cloud Blog Menjadi Warna-Warni
1. Login ke akun blogger.com
2. Pilih Template kemudian Edit HTML
3. Jangan lupa centang Expand Template Widget
4. Masukkan kode css berikut di atas kode ]]></b:skin>

* Label Could Warna-Warni - http://kurniasepta.blogspot.com */
.label-size-1 a {
font-size: 13px;
text-decoration: none;
color:#4B8A08;
}
.label-size-2 a {
font-size: 15px;
text-decoration: none;
color:#DF0101;
}
.label-size-3 a {
font-size: 16px;font-family: Arial, Trebuchet MS, Verdana;text-decoration: none;
color:#045FB4;
}
.label-size-4 a {
font-size: 18px;
text-decoration: none;
color:#DF7401;
}
.label-size-5 a {
font-size: 23px;
text-decoration: none;
color:#045FB4;
}
.label-size-1 a:hover,
.label-size-2 a:hover,
.label-size-3 a:hover,
.label-size-4 a:hover,
.label-size-5 a:hover { text-decoration:underline;}

5. Kode merah adalah kode warna, Simpan Template jika sudah selesai

Di atas langkah awal, masih ada langkah selanjutnya untuk menampilkan label cloud yang warna-warni. Langsung saja kita ikuti langkah selanjutnya;

1. Pilih Tata Letak, kemudian Tambah Gadget
2. Lalu pilih Label dan pilih tampilkan Cloud
3. Klik Simpan jika sudah selesai.

Jika sudah selesai semua, coba lihat hasil dari membuat Label Cloud menjadi warna-warni.