Cara Menciptakan Widget Label Warna Warni Di Blog

Cara Membuat Widget Label Warna Warni Di Blog-Kali ini aku akan membahas sedikit mengenai widget label.Widget label atau tags berfungsi untuk mengelompokkan kategori postingan yang ada di blog kita.Membuat label widget dengan memakai warna maka akan memperindah tampilan blog kita.Tampilannya menyerupai ini.

Diatas yaitu pola widget label dengan memakai warna warna yang cerah sehingga menciptakan siapa saja yang melihatnya akan tetarik.Berikut cara menciptakan widget label warna warni dengan mudah:

1.Login pada blog kamu

2.Pilih hidangan Template kemudian Edit HTML

3.Copy kemudian pastekan aba-aba dibawah ini sempurna diatas kode  </b:skin>.Jika tidak ada aba-aba </b:skin> di blog kamu,kamu sanggup mencari aba-aba </style> menggunakan kombinasi tombol CTRL+F kemudian cari

/* Sidebar Label Cloud */
.cloud-label-widget-content {text-align: left;} .label-size
{background: #83B4D8;display: block;float: left;margin: 0 3px 3px 0;color: #fff;font-family: Oswald, Arial, Sans-Serif;font-size: 11px;text-transform: uppercase;} .label-size:nth-child(1)
{background: #fb0058;} .label-size:nth-child(2)
{background: #37C371;} .label-size:nth-child(3)
{background: #10BBEA;} .label-size:nth-child(4)
{background: #fe25ec;} .label-size:nth-child(5)
{background: #366396;} .label-size:nth-child(6)
{background: #A3195C;} .label-size:nth-child(7)
{background: #500c6ff;} .label-size:nth-child(8)
{background: #F2A15F;} .label-size:nth-child(9)
{background: #ffc600;} .label-size:nth-child(10)
{background: #54b70b;} .label-size:nth-child(11)
{background: #99CC33;} .label-size:nth-child(12)
{background: #ff463d;} .label-size:nth-child(13)
{background: #3FDECF;} .label-size:nth-child(14)
{background: #FF2F0A;} .label-size:nth-child(15)
{background: #E9DB58;} .label-size:nth-child(16)
{background: #42FFBD;} .label-size:nth-child(17)
{background: #6899ED;} .label-size:nth-child(18)
{background: #FF52AE;} .label-size:nth-child(19)
{background: #8DBC2F;} .label-size:nth-child(20)
{background: #80FF00;} .label-size a, .label-size span
{ display: inline-block; color: #fff !important; padding: 4px 10px; font-weight: bold; } .label-size:hover { background: #222; } .label-count { white-space: nowrap; padding-right: 3px; margin-left: -3px; background: #333; color: #fff ; } .label-size:hover .label-count, .label-size:focus+.label-count { background-color: #FF6BFF; }

CATATAN: Warna merah pada aba-aba tersebut yaitu aba-aba warna.Kamu sanggup menggantinya sesuka hati kamu.

4.Setelah final mengedit HTML,selanjutnya klik simpan

5.Selanjutnya,klik menu Tata Letak di blog kamu

6.Klik tambahkan gadget/widget kemudian pilih label

7.Buat pengaturan menyerupai dibawah ini

8.Selesai

Penutup
Membuat widget label warna warni di blog tidaklah sulit.Kamu sanggup mencobanya sendiri pada blog kamu.Selain warnanya yangcerah,widget menyerupai itu juga sanggup menyegarkan mata siapa saja yang mengunjungi blog kamu.