Blog Tutorial

Tutorial Blog, Cheat Games, Tutorial Ponsel, Tutorial Komputer, Tutorial Browser

Jumat, 05 Maret 2010

Membuat Label Cloud Animasi

Kategori :
Membuat Label Cloud AnimasiLabel Cloud animasi sangat bagus untuk mempercantik blog kalian semua loh sobat semua, kalau ingin melihat demo atau screenshoutnya lihat saja Widget yang letaknya di atas Buku tamu di blog ini yang jelas di Home Page. Mungkin Trik ini banyak yang sudah membagikannya/ mem-Publishnya namun apa salahnya kalau say membagikannya lagi?? kenapa saya membagikannya kembali?? karena ada seorang visitor di blog saya yang menginginkan Widget tersebut makannya saya buat.

Sebenarnya trik Membuat Label Cloud animasi ini saya dapatkan dari Bloggerbuster yaitu salah satu blogger master di dunia blog, kalau saya boleh kasih tips, Wdget ini tidak memberatkan Kecepatan loading blog sobat loh karena Javascript yang digunakan tidak di upload jadi tidak perlu dipanggil. oke mungkin sekian ajach cuap-cuapnya sekarang kita menuju langkah-langkahnya :
  1. Login ke blogger
  2. Masuk ke Tata letak ==>> Edit HTML
  3. Setelah itu klik kotak yang berada di samping tulisan Expand Widget Template
  4. Sebelum kita melakukan pembedahan (kaya dokter ajach :D) mari kita backup terlebih dahulu untuk menghindari kerusakan pada template sobat.
  5. oke setelah mem-backup langsung ajach cari kode <b:section class='sidebar' id='sidebar' preferred='yes'> lalu taruh kode ini di bawahnya


    <b:widget id='Label23' locked='false' title='' type='Label'>
    <b:includable id='main'>
    <b:if cond='data:title'>
    <h2><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <script src='http://oketrik.googlecode.com/files/swfobject.js' type='text/javascript'/>
    <div id='flashcontent'></div>
    <script type='text/javascript'>
    var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "300", "200", "7", "#000000");
    // uncomment next line to enable transparency
    //so.addParam("wmode", "transparent");
    so.addVariable("tcolor", "0x00ff00");
    so.addVariable("mode", "tags");
    so.addVariable("distr", "true");
    so.addVariable("tspeed", "100");
    so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
    so.addParam("allowScriptAccess", "always");
    so.write("flashcontent");
    </script>
    <b:include name='quickedit'/>
    </div>
    </b:includable>
    </b:widget>


    Penjelasan :
    • kode yang berwarna Merah menunjukan warna Background dan sobat juga bisa menggantinya
    • kode yang 300 menunjukan panjang dari Widget itu sobat bisa menggantinya dengan memperbesar atau memperkecilnya
    • kode yang 200 menunjukan Lebar dari Widget itu sobat bisa menggantinya dengan memperbesar atau memperkecilnya
    • kode yang berwarna Hijau menunjukan warna dari Teks yang ada di dalam Widget itu, sobat juga bisa menggantinya
    • kode 100 menunjukan kecepatan berputarnya widget itu, sobat juga bisa menggantinya apabila sobat ingin mempercepat sobat bisa tambah nominalnya atau sebaliknya.

  6. Nah sekarang sobat bisa simpan.

Bagaimana dengan Trik Membuat Label Cloud animasi?? mudah bukan pemasangannya?? kalau sobat ada kesulitan dalam pemasangannya sobat bisa beritahu saya lewat Kotak komentar atau langsung Chat With YM. oke sekian dari saya Terima Kasih and Happy Blogging.
Bagikan Artikel : Facebook Twitter Google+ Linkedin Technorati Digg

34 Komentar untuk Membuat Label Cloud Animasi

keren nich widgetnya n keren jg sob penjelasan untuk modifikasinya, good luck :D

greeting for you
ehm i was try this methode and finished selanjutnya kabuuuurrr...thnxs n good luck

Mantep tutorialnya..!! keep blogging

keren euy blognya... full animasi... jadi betah nongkrongin blognya... bnayk ilmunya... tengkyu...

mantab sob. labelnya bisa puter2 kayak bola dunia. nice post

manteb tutornya sob,salam kenal,kujungan perdana nich

Bagus tuh label cloud, cuma agak berat aja kawan ^^ soalnya saya juga pernah coba..

Omong2 ada Award terbaik nih buat kawan, tolong diambil yah ^^ di

http://www.gotbloggers.co.cc/2010/03/free-backlink-award-from-my-friends.html

Semoga berkenan.

nice.. tx neyh infonya..

Assalamualaikum. . .
mampir lagi nich. . .
Saya ucapkan banyak terimakasih, kerena anda langsung merespon dan memberikan jawaban dan tutorialnya dan setelah saya coba, berhasil. . .
sekali lagi saya ucapkan terimakasih banyak.

@Wong tanjung pura ==>> Wa'alaikumsalam...
Sama-sama sob, kalau ada yang mau di request lagi beritahu saja oke... :D

wah thanks artikel nya bro... tak copy ya artikelnya...:4:

oy tukeran link yuk...

http://www.malebe.co.cc/

:2: :2:

bos aq udah nyoba tapi kelihatanya eroor....

tp sip deh....... www.niev.co.cc

bagus banget blognya...banyak tips2 keren....

MANTAPP CUUUY....!!! ^0^

Komentar ini telah dihapus oleh pengarang.

gan ..ane cari kodenya di html blog ane kok gak ada, mohon bantuannya ya.matursuwun.

Mantap ni..
Ohya, mau tanya ane dah saling bertukar link dngan blog lain qo links in masih 0 ya ..
Mohon dbantu y??
Thanks..

http://insanshalih.blogspot.com

@Ihsanul Huda >> untuk links in pada alexa saya belum tahu gan, tapi mungkin anda bertukar link dengan yang beda tema dari blog anda jadi links in masih 0

thanks y buat info na........................

thanks infonya gan, kunjung juga di http:motorheroes.blogspot.com ,,, sukses selalu

aku nyoba kok teks nya ndak muncul ya.....???
penempatan udah bener n ukuran juga udah pas...., apanya donk yang kurang......,

hmmm, scriptnya sudah broken mas tepatnya link http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf

maaf ya saya tidak bisa membantu

oke mas...., saya nyoba untuk scriptnya ada 2 blog yang satu berhasil tapi satunya lagi gagal
menu label animasi untuk
trialmyblog.blogspot.com ( oke dan berhasil )
tapi setelah tak coba di ( asianadesun.com )
gagal...., kalo masalah script sepertinya kok ndak masalah
trims

@Asiana > waktu saya bka url di atas, sudah eror. klo berhasil di blog yang satu, bagus deh :D

thx atas 50 jempolnya :)

kok kodenya nggak ada di edit HTML mas

Bagus labelnya, mas.
Jadi kepengen pasang di blog saya nih.. :)
Makasih sharing kerennya.

Salam kenal dari Direktori Penerjemah Indonesia - Media Promosi Online dan Kirim Artikel Terjemahan Gratis!

gan kenapa kode saya tidak temukan ??
mohon pencerahannya :)

wah, ini yang ane2 cari2 gan

gua coba cok gak bisa ya gan?

reygareysa.blogspot.com blum dong kak