IndeksP O R T A LCalendarFAQPencarianAnggotaGroupPendaftaranLogin

Share | 
 

 [tutor] pasang flash tag-cloud di blogspot

Topik sebelumnya Topik selanjutnya Go down 
PengirimMessage
NDI
Founder
Founder


Age : 9
Contribute : 126
Jumlah posting : 2735
Lokasi : Admin Panel

PostSubyek: [tutor] pasang flash tag-cloud di blogspot   Sat 31 Oct 2009 - 20:50

hehe, mau berbagi ilmu tentang blogspot....

cekidot :

Bagi anda pengguna Wordpess tentu tidak asing lagi dengan tag cloud wp-cumulus. Ternyata setelah dimodifikasi, wp-cumulus dapat juga dipasang di blogger. Namanya menjadi Blogumus. Contohnya bisa dilihat di sidebar sebelah kanan di blog ini.

Cara membuatnya cukup mudah, buktinya orang lugu seperti saya pun bisa Siul-siul)

Ikuti saja langkah-langkahnya berikut ini :

1. Log in ke blogger
2. Dari dashboard, klik Lay out, kemudian edit HTML, jangan lupa klik tanda expand widget
3. Cari kode di bawah ini (untuk memudahkan, tekan ctrl+F untuk memunculkan menu Find, kemudian masukkan kode yang dicari).

Code:
<b:section class='sidebar' id='sidebar' preferred='yes'>

4. Setelah ketemu, copy kode di bawah ini, kemudian tempelkan (paste) dibawah kode yang tadi.

Code:
<b:widget id='Label99' locked='false' title='Labels' type='Label'>

    <b:includable id='main'>

    <b:if cond='data:title'>

    <h2><data:title/></h2>

    </b:if>

    <div class='widget-content'>

    <script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'/>

    <div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>

    <script type='text/javascript'>

    var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

    // uncomment next line to enable transparency

    http://so.addParam("wmode", "transparent");

    so.addVariable("tcolor", "0x333333");

    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>



5. Klik Save.

selanjutnya kita bisa edit warna dan segala setingannya...

Setting secara default adalah sebagai berikut :

Code:
 * Lebar 240px
    * Tinggi 300px;
    * Warna Backgrund : Putih
    * Warna teks : abu-abu
    * Ukuran Font "12"


mengubah ukuran tinggi dan lebar

Cari kode ini :

Code:
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");


Ukuran lebar (saat ini 240px) diberi warna merah dan tinggi (300px) terlihat berwarna biru. Angka-angka itu adalah dalam satuan pixel. Kita bisa mengubahnya sesuai kebutuhan, menyesuaikan sidebar di blog kita.

Mengubah warna background

Masih menggunakan kode di atas, background berwarna putih ditunjukkan dengan kode #ffffff

Code:
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

Kita bisa mengubahnya dengan warna lain misalnya warna merah muda. Ganti kodenya #ffffff dengan #ff0000. Cobalah ganti dengan kode-kode warna lainnya.

Mengubah warna text

Secara default, text berwarna abu-abu ( hex value #333333). Kita bisa menggantinya dengan mengubah kode di bawah ini.

Code:
so.addVariable("tcolor", "0x333333");

Misalnya mau kita ubah menjadi hitam, ganti 333333 menjadi 000000 (Ingat, Ubah kode angkanya saja, tidak perlu menuliskan # )

Mengatur ukuran font

cari kode berikut ini :

Code:
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>");


Ukuran font saat ini adalah 12. Kita bisa mengubahnya lebih besar atau lebih kecil sesuai kebutuhan.

selesai... :lol!:

thx to : Mas Roy Tanck dan Mbak Amanda Fazani

contoh tampilan flash tag-cloud diblog saya :
Spoiler:
 

_________________




Kembali Ke Atas Go down
Lihat profil user
arxerine
Advanced
Advanced


Age : 24
Contribute : 6
Jumlah posting : 564

PostSubyek: Re: [tutor] pasang flash tag-cloud di blogspot   Fri 1 Jan 2010 - 19:37

di saya ga bisa tranparent, digimanain?
Kembali Ke Atas Go down
Lihat profil user
Vicaksana
Advanced
Advanced


Contribute : 49
Jumlah posting : 2366
Lokasi : Unknown

PostSubyek: Re: [tutor] pasang flash tag-cloud di blogspot   Mon 6 Jun 2011 - 14:05

kok gk bisa ya? puyeng....
Kembali Ke Atas Go down
Lihat profil user
Sponsored content




PostSubyek: Re: [tutor] pasang flash tag-cloud di blogspot   Today at 15:32

Kembali Ke Atas Go down
 

[tutor] pasang flash tag-cloud di blogspot

Topik sebelumnya Topik selanjutnya Kembali Ke Atas 
Halaman 1 dari 1

Permissions in this forum:Anda tidak dapat menjawab topik
Net Detective Indonesia :: Warung Net Detective Indonesia :: Cyber-Life :: Blogger Area-