Rabu, 06 Februari 2013

Cara Membuat Label Cloud Berwarna-warni

Setelah kemarin kita "belajar Tutorial Cara Membuat Label Green Cloud With Css3", kali ini kita akan belajar Cara Membuat Label Cloud Berwarna-warni.

Langkah pertama Sebelum membuat Label Cloud Menjadi Berwarna-warni,anda harus memasang widget label blog:
1. Pilih Tata Letak, kemudian Tambah Gadget
2. Lalu pilih Label dan pilih tampilkan Cloud
3. Klik Simpan jika sudah selesai.

Langkah kedua:
1. Masuk Ke Akun Blogger Anda Anda
2. Pilih ke menu Template
3. Kemudian klik Edit HTML
4. Centang Expand Widget Template
5. Kemudian cari kode ]]></b:skin>
6. Lalu copas/copy paste script di bawah ini,Lalu letakan di atas kode ]]></b:skin>

.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;}

7. simpan dan lihat hasilnya
8. selamat mencoba

READ MORE - Cara Membuat Label Cloud Berwarna-warni

Cara Membuat Label Green Cloud with Css3



  • login blog
  • buka menu template --> edit HTML
  • lalu cari kode ]]></b:skin>
  • letakkan kode dibawah ini tepat diatas kode ]]></b:skin>


#Label1 a{outline: 1px rgba(255,255,255,0.4) dashed;
border: 1px rgba(0,0,0,0.3) dashed;
padding: 4px 10px 4px 20px;
text-decoration: none;
color:#000000;
white-space: nowrap;
font-family: Arial;
font-size: 12px;
font-weight: bold;
position: relative !important;
background: #8dc63f;
float: left;
padding: 5px 3px;
margin: 0 5px 5px 0;
border-radius:4px 4px; -moz-border-radius:4px 4px 4px 4px; -khtml-border-radius:4px 4px 4px 4px; -webkit-border-radius:4px 4px 4px 4px; border-radius:4px 4px 4px 4px;
}
#Label1 a:hover{
color:#C16E00;
}
.label-size{line-height:1.5;align:left;}


  • simpan
  • selamat mencoba :)
READ MORE - Cara Membuat Label Green Cloud with Css3