materi : Cara Membuat Widget Label manarik dan keren
Judul : Cara Membuat Widget Label manarik dan keren
Cara Membuat Widget Label manarik dan keren
Artikel Bloger,Widget label cloud biasanya hanya menggunakan label biasa dan tidak menarik untuk diklik pengunjung, oleh karena itu pemakaian widget yang unik dan elegan dapat menarik perhatian pengunjung untuk mengklik dan melihat isi label tersebut. Dan kali ini saya menerangkan cara mengubah widget label agar menjadi unik dan elegan untuk dipasang pada blog kita. kalau mau lihat HASILNYA
Mari Kita simak cara mengubah widget label Cloud Unik Dan Elegan dibawah ini :
- Silahkan masuk ke dasbor blog anda
- Kemudian Pilih Template >> Edit HTML >> Prooced
- Setelah jendela Edit HTML Terbuka silahkan anda cari kode berikut :
]]></b:skin>
- Setelah ketemu silahkan Copy Kode berikut ini dan letakkan tepat diatas kode ]]></b:skin>.
/*-----Widget by http://bondowoso-jawa.blogspot.com/----*/
.label-size{
margin:0 2px 6px 0;
padding: 3px;
text-transform: uppercase;
border: solid 1px #C6C6C6;
border-radius: 3px;
float:left;
text-decoration:none;
font-size:10px;
color:#666;
}
.label-size:hover {
border:1px solid #6BB5FF;
text-decoration: none;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
-ms-transform: rotate(7deg);
transform: rotate(7deg);
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');
zoom: 1;
}
.label-size a {
text-transform: uppercase;
float:left;
text-decoration: none;
}
.label-size a:hover {
text-decoration: none;
- Setelah kode diatas terpasang simpan pengaturan anda kemudian keluar/close dari edit HTML
- Kemudian masuk ke layout >> Add Gadget >> Label
- Pilih seperti dibawah ini dan save pengaturan label.
- Kemudian atur letak tag cloud sesuai template anda.
- Terakhir simapan semua perubahan, dan chek hasilnya.
NB :
Jika Sahabat blogger ingin mengubah warna kotaknya agar sesuai dengan warna template sahabat silahkan ganti kodeyang berwarna merah dengan kode warna yang sesuai dengan warna template blog sahabat.
Setelah sahabat mengikuti langkah-langkah diatas sudah pasti akan berhasil seperti gambar dibawah ini :
Demikianlah Artikel Cara Membuat Widget Label manarik dan keren
Sekian materi Cara Membuat Widget Label manarik dan keren, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sekian postingan kali ini semoga kalian bisa kembali lagi ke sini dan mengajak teman kalian menuju ke sini supaya saya lebih semangat lagi untuk update artikel maka sebarkan link blog ini dan jangan lupa untuk komentar bisa melalui facebook juga lho komentarnya .
yg animasi ada gk gan
BalasHapusaku carikan dlu kk
Hapusmasih setia sama tampilan yg lama mas hehehe :D
BalasHapusgpp
Hapusmampir kemari sambil meramaikan suasana :)
BalasHapusthx
HapusIzin mampir dan membaca artikelmu sob..
BalasHapusWidgetnya keren tuh gan, nanti ane praktekin deh..
Jangan Lupa Komen balik ya sob.. ditunggu :D
#Salam.
by Tutorial Blogz
silahkan
HapusBagus widgetnya sobat tetapi sepertinya tempat saya udah penuh untuk pasang widget baru
BalasHapusthx
HapusKeren Sob...
BalasHapusthx
HapusKalo Label Yang Kayak Blog Ini Gimana Caranya?
BalasHapusjadi label terus list ganti dengan cloud
Hapuswah trik label nya bagus juga..
BalasHapushttp://tanpaloding.blogspot.com/
thx kk
Hapusbagus banget nih artikelnya,
BalasHapuskomen baliknya di tunggu
ok sob
Hapusjgn lupa kunjungan balik and komen balik gan,,
BalasHapushehe
ok
Hapusnyimak gan, masih keren punya ane...:D
BalasHapusya
Hapussilahkan
BalasHapusya
BalasHapusBlogWalking sob ^_^
BalasHapusnice info gan
BalasHapuskunjungi balik ya
ya
Hapusfollback donk gan, ane udah follow atas nama "Hilman Manchunian" plissss.. http://seputarmovies.blogspot.com/
BalasHapusudah kk
HapusWahhh....Keren nih Sob ! tapi ada yang pak gambarnya gak ?
BalasHapusVisit Back yah :
Tedi-Technology
#Salam Sukses ^_^
thx infonya gan
BalasHapusjgn lupa komen back http://adeputra-pkp.blogspot.com
ini berat gk gan ??
BalasHapuskomen back http://kiritoblogs.blogspot.com