Home » » Cara Membuat Label Cloud keren dan cantik

Cara Membuat Label Cloud keren dan cantik

Written By Unknown on Selasa, 13 Agustus 2013 | 18.55

Cara Membuat Label Cloud keren dan cantik - Kali ini Kang dedy share cara membuat Label Cloud keren dan cantik, modifikasi kali ini cukup simple dan tentunya sangat mudah. banyak cara untuk mempercantik label blog, diantaranya dengan menggunakan css agar kelihatan menarik.


Untuk membuat dan memodifikasi tampilan Label Cloud Blogger seperti gambar diatas, sobat hanya perlu menambah kode CSS pada template. Dibawah ini saya bagikan juga kode CSS berikut tutorial cara pemasanganya pada template blogger. 

Langsung saja untuk tutorialnya ikuti Cara Membuat Label Cloud keren dan cantik berwarnadibawah ini:
1. Masuk Blogger Dasboard > Template > Edit HTML > Lanjutkan
2. Backup template
3. Tekan Control + F > cari kode ]]></b:skin>
4. Letakkan kode dibawah ini tepat diatas kode ]]></b:skin>
/*-----Labels Cloud Styled widget by proBlogiz.blogspot.com----*/ .label-size{ margin:0; padding:0; position:relative; } .label-size a , .label-size span{ float:left; height:24px; line-height:24px; position:relative;font-size:12px; margin-bottom: 9px; margin-left:20px; padding:0 10px 0 12px; background:#0089e0; color:#fff; text-decoration:none; -moz-border-radius-bottomright:4px; -webkit-border-bottom-right-radius:4px; border-bottom-right-radius:4px; -moz-border-radius-topright:4px; -webkit-border-top-right-radius:4px; border-top-right-radius:4px; } .label-size a:before , .label-size span::before{ content:""; float:left; position:absolute; top:0; left:-12px; width:0; height:0; border-color:transparent #0089e0 transparent transparent;border-style:solid; border-width:12px 12px 12px 0; } .label-size a:after , .label-size span::after{ content:""; position:absolute; top:10px; left:0; float:left; width:4px;height:4px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; background:#fff; -moz-box-shadow:-1px -1px 2px #004977; -webkit-box-shadow:-1px -1px 2px #004977; box-shadow:-1px -1px 2px #004977; } .label-size a:hover , .label-size span::hover { background:#555;} .label-size a:hover:before , .label-size span::hover::before{border-color:transparent #555 transparent transparent;}
5. Jangan lupa Save Template dan pastikan label pada template sobat sudah dibuat label cloud. OK
Sekian dulu Cara Membuat Label Cloud keren dan cantik berwarna, semoga bermanfaat. Good Luck

Share to

Facebook Google+ Twitter Digg


Artikel Terkait:

Kode Smile Untuk Komentar


:a :b :c :d :e :f :g :h :i :j :k :l :m :n :o :p :q :r :s :t

0 komentar:

Posting Komentar

WARNING
Komentar Anda Tidak Boleh Mengandung Unsur
1. penghinaan
2. spam komen
3. link aktif atau text anchor dan sejenisnya
4. berkomentar tanpa unsur sara, pornografi, atau kata-kata tidak baik lainnya ya :)

Jika kamu memiliki pertanyaan atau tanggapan mengenai artikel ini, silahkan tinggalkan komentar kamu disini !

Follow+Like

 
Support : facebook | twitter | google plus
Copyright © 2013. vhiZseo - All Rights Reserved
Template Created by Creating Website Published by Mas Template
modified by vhizseo Proudly powered by Blogger