anda mesti sedar akan kewujudan satu tag / Categories Cloud yang cantik di sidebar blog saya. Tag tersebut menggunakan flash sebagai asas dan telah diconvert oleh Amanda untuk membolehkan 3d tag ini digunakan di dalam blogger (blogspot). Blogumus ini asalnya telah direka oleh Roy Tanck khas untuk pelantar WordPress dengan menggunakan nama Cumulus.

di sini saya hanya dapat memberikan tutorial bagaimana hendak memasukkan 3d tag cloud ini di dalam blogspot sahaja, bagi mereka yang menggunakan blog servis yang lain, anda boleh merujuk kepada link ini, Cumulus Open Source. bagi mereka yang menggunakan WordPress, anda boleh merujuk kepada blog pereka kod ini, www.roytanck.com.

Gambar 1: skrinkap Cumulus

LANGKAH PERTAMA

Pastikan anda backup terlebih dahulu themes anda, jika ada apa-apa kesilapan, themes anda dapat direstore kembali.

LANGKAH KEDUA

Masuk tab Layout, dan kemudian klik pada tab Edit HTML. Pada bahagian Edit Template, cari kod ini (atau lebih kurang sama):

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

(perhatian: pertama, jika kod yang dicari tidak dijumpai, tick'kan terlebih dahulu Expand Widget Templates, jika tidak, sebahagian kod widget akan tersorok. kedua, saya tidak pasti samada anda mempunyai kod yang sama di atas disebabkan themes yang anda gunakan mungkin telah diejas sepenuhnya oleh pereka themes tersebut. jadi, dimana hendak meletakkan kod di atas?. pastikan anda meletakkannya bersama widget-widget anda yang lain.

Selepas itu, masukkan kod berikut betul-betul dibawah kod di atas,

http://syfu07.googlepages.com/code1.txt

LANGKAH KETIGA

klik butang preview, jika anda dapat melihat Blogumus ini, bermakna anda berjaya. simpan template tadi. Anda boleh mengalihkan tag cloud ini kemana-mana tempat yang sesuai dengan menggunakan Page Elements.


LANGKAH-LANGKAH TAMBAHAN

Mengubah Setting Blogumus

Pada setting asal Blogumus adalah mengikut preset berikut:

- Lebar (Width) disetkan kepada 240px

- Tinggi (Height) disetkan kepada 300px

- Warna latarbelakang disetkan warna putih

- Tulisan (Font) disetkan warna kelabu (Grey)

- Saiz tulisan (Font) disetkan kepada saiz 12


mengubah saiz widget

Jika anda hendak mengubah saiz widget ini mengikut citarasa anda sendiri, anda perlu mengubah kod yang diberikan di atas yang telah diletakkan di bahagian edit HTML.

Jika hendak mengubah saiz widget ini, cari kod di bawah ini dan ubah jumlah yang diwarnakan:

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

lebar widget ini adalah 240, manakala tinggi widget ini pula adalah 300, kedua-dua jumlah ini adalah di dalam ukuran pixel (px). jadi anda boleh mengubahnya supaya ianya bersesuaian dengan saiz bar tepi (sidebar) blog anda.

jika anda hendak mengubah warna latar belakang widget ini, sila ubah value #ffffff, cnth: jika anda mahu menukar warna latar belakang kepada warna merah cerah, anda perlu menukarkannya kepada #ff0000.

jika anda mahu menukarkan warna tulisan (font) pada widget ini, cari line berikut dan ubahkan value yang diwarnakan,

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

Perhatian: ingat, tcolor adalah variable dari flash dan code ini tidak mempunyai simbol hash yang biasa ada pada kod warna hex, jadi pastikan anda hanya meletakkan value nombor sahaja.

jika anda hendak mengubah saiz tulisan (font) pada widget ini, sila ubah jumlah pada kod berikut, anda boleh mengubah kepada jumlah yang lebih kecil atau besar mengikut selera anda,

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

ubah value 12 kepada saiz yang dikehendaki, jika anda ingin mengecilkan lagi saiz font, ubahkannya kepada jumlah yang lebih kecil, jika hendak membesarkan lagi saiz font, ubahkannya kepada jumlah yang lebih besar.

Kredit dan Bantuan.

artikel ini diterjemah dari versi bahasa inggeris yang telah dikeluarkan oleh Amanda, semua kredit hendaklah diberikan kepada Amanda selaku penukar kod, dan Roy Tanck selaku pereka widget ini.