-->

Cara Membuat Widget Label Warna Warni Di Blog

Cara Membuat Widget Label Warna Warni Di Blog-Kali ini saya akan membahas sedikit mengenai widget label.Widget label atau tags berfungsi untuk mengelompokkan kategori postingan yang ada di blog kita.Membuat label widget dengan menggunakan warna maka akan memperindah tampilan blog kita.Tampilannya seperti ini.
Diatas adalah contoh widget label dengan menggunakan warna warna yang cerah sehingga membuat siapa saja yang melihatnya akan tetarik.Berikut cara membuat widget label warna warni dengan mudah:

1.Login pada blog kamu

2.Pilih menu Template lalu Edit HTML

3.Copy lalu pastekan kode dibawah ini tepat diatas kode  </b:skin>.Jika tidak ada kode </b:skin> di blog kamu,kamu bisa mencari kode </style> menggunakan kombinasi tombol CTRL+F lalu 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 kode tersebut adalah kode warna.Kamu bisa menggantinya sesuka hati kamu.

4.Setelah selesai mengedit HTML,selanjutnya klik simpan

5.Selanjutnya,klik menu Tata Letak di blog kamu

6.Klik tambahkan gadget/widget lalu pilih label




7.Buat pengaturan seperti dibawah ini



8.Selesai

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

0 Response to "Cara Membuat Widget Label Warna Warni Di Blog"

Post a Comment

NO SPAM PLEASE

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel