Headlines News :
Home » » Cara Membuat Widget Label Cloud ala Wordpress untuk Blogger

Cara Membuat Widget Label Cloud ala Wordpress untuk Blogger

Written By Johannes Nababan on Monday, June 18, 2012 | 1:06 PM

Demo Image - Before
Jika sebelumnya saya memposting tentang Cara Membuat Widget MintShare Sosial Share Button Layout  Versi 1, 2, 3, 4, dan 5. Saya akan memposting lagi tentang Widget Label Cloud ala Wordpress.

Demo Image - After
Bagi para blogger yang menginginkan blognya terlihat profesional, ada baiknya mengubah tampilan Widget Label Defaultnya menjadi Widget Label Cloud ala Wordpress, disamping tampilannya cantik dan terlihat Profesional, Widget Label Cloud memiliki kelebihan, yaitu tidak menggunakan kode-kode javascript dan Jquery yang membuat loading blog kita lambat, namun menggunakan kode-kode CSS yang loadingnya ringan. Pada kasus kali ini, kita hanya sedikit mengutak-atik kode widget label default pada template blog kita dan sedikit menambahkan kode-kode CSS yang ringan.





Baiklah langsung saja saya akan jelaskan tentang Cara Membuat Widget Label Cloud ala Wordpress untuk Blogger di bawah ini:
 
»Cara Pemasangan« 
 
Sebelum memasang Widget ini, anda harus terlebih dahulu memasang WIdget Label Default dahulu. Sesuaikan dengan gambar berikut :
 
 
http://a1.sphotos.ak.fbcdn.net/hphotos-ak-snc7/599200_323998744349610_156645286_n.jpg
 
  • Login account blogger kamu
  • Pilih template
  • Klik edit HTML
  • Centang Expand Template WidgetCarilah kode
  • Carilah kode ]]></b:skin>
  • Setelah ketemu, pastekan kode CSS di bawah ini tepat diatas kode ]]></b:skin> 
/* -- Labels -- */
.label-size {line-height: 1.2;float: left;font:normal normal 13px Cuprum;}
.label-size a {-khtml-border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;background: #aaa;border: none;border-radius: 3px;color: #fff;text-shadow:0 -1px 1px rgba(0,0,0,0.25);float: left;margin: 0 4px 4px 0;padding: 5px 6px;}
.label-size a:hover {background: #ffcb0f;}-
.label-size span {float: right;font-size: 9px;margin: 0 0 4px;}
  • Save Template
Share this article :

18 komentar:

  1. Mantap sob.. thnks infonya!

    ReplyDelete
  2. berbagi info lomba menulis blog


    http://ba12.blogspot.com/2012/07/jakarta-di-mata-blogger-kontes-blog.html

    ReplyDelete
  3. Terimakasih informasi nya gan, sangat bermanfaat :)
    nice post :)

    ReplyDelete
  4. wahh keren sob..ijin copy scrip.nya eahh....

    ReplyDelete
  5. Info yang menarik ... thanks

    http://curhatz.blogspot.com/

    ReplyDelete
  6. coba dulu kang widgetnya.
    thanks ya :)

    ReplyDelete
  7. bagus juga untuk blog kita ni widget
    nice share

    ReplyDelete
  8. kerennnn...
    makasih atas infonya..

    follow back ya in my site blogg : ariewinkygallery.blogspot.com

    thanks ^_^

    ReplyDelete
  9. postingan tentang cara membuat widget... Sangat menarik untuk dibaca, Saya suka mengunjungi blog ini.

    ReplyDelete
  10. sipp gan..!

    kunjungan sob
    http://anginskk.blogspot.com/

    ReplyDelete
  11. wah sangat membantu para pemula..
    http://nendrapatmanaputra.blogspot.com

    ReplyDelete
  12. saya suka blog anda, saya berharap untuk melihat lebih banyak dari anda. apakah anda menjalankan situs lain????

    ReplyDelete

Setelah membaca Artikel yang saya berikan diatas, anda dapat memberikan komentar terhadap Artikel diatas tanpa adanya :
-Spam
-Rasis
-Dan perkataan lainnya yang dapat membuat orang lain merasa tersinggung.

Terima Kasih

banner ads banner ads

 
Support : Blog | Joe | Johny Template
Copyright © 2011. Blog | Joe - All Rights Reserved
Template Created by Johny Template Published by Blog | Joe
Proudly powered by Blogger