Skip to main content

Membuat tag cloud link bejalan cumulus di blogdetik


tagcloudcumulusTag Cloud Cumulus memang mempunyai daya tarik tersendiri yang acapkali membuat banyak blogger kepincut untuk memasangnya di blog. Bukan saja fungsinya yang menjadi daya tarik, namun tampilannya yang atraktif justru lebih banyak menjadi faktor dominan keinginan untuk memanfaatkan tag cloud spesial ini. Beberapa blogger mengengenal tag cloud cumulus hanya sebagai tag cloud animasi atau tag cloud dengan teks yang bisa bergerak. Ungkapan yang sangat masuk akal karena untuk sementara ini tag cloud dengan teks link beranimasi yang bisa bergerak dengan amat dinamis hanyalah tag cloud cumulus dan tag cloud jQuery.
Untuk membuat tag cloud cumulus tidaklah sulit, hanya diperlukan ketelitian ekstra ketika menyusun link demi link yang akan menampilkan teks dalam tag cloud. Link-link yang tersusun sebagai kode HTML harus dibuat sambung menyambung tanpa putus sama sekali. Jadi istilah lain adalah tanpa spasi. Sampeyan akan melihat secara lebih jelas dengan melihat bentuk susunan link yang tertulis di kode HTML tag cloud. Ketika tag cloud akan dipasang di blog sampeyan, link-link dan teks link inilah yang nantinya harus diganti sesuai dengan kebutuhan blog. Yang jelas, selain bisa digunakan untuk menampilkan beberapa kategori posting, link juga bisa kita manfaatkan untuk menampilkan link yang berbeda seperti blog atau situs lain. Yah … barangkali saja sampeyan punya 10 blog yang berbeda?! he … he … atau mungkin 100 buah blog?

xHTML dan javascriptTag Cloud Cumulus

<div style="margin:10px auto;float:none;text-align:center;padding:5px 0px;border:3px solid #777;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;background:#444;">
<script type="text/javascript" src="http://h1.ripway.com/santyeka/Javascript/bgsGR_cumulus.js"></script>
<div id="flashcontent" style="padding:0 10px;font-size;18px;font-weight:bold;background:#222;color:yellow;">gubhug reyot</div>
<script type="text/javascript">
var so = new SWFObject("http://www.swfcabin.com/swf-files/1275932799.swf", "tagcloud", "200", "200", "7", "#ddeefe");
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x0307bc");
so.addVariable("tcolor2", "0x138002");
so.addVariable("hicolor", "0xfb3f1a");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><a href='http://gubhugreyot.blogspot.com' style='22' color='0xf602ff' hicolor='0x0c03c9'>gubhug reyot</a><a href='http://gubhugreyot.blogdetik.com' style='16'>GR blogDETIK</a><a href='http://gubhugreyot.blogspot.com' style='16'>Modifikasi Template</a><a href='http://bloggerstuars.blogspot.com' style='14'>Menu Masakan</a><a href='http://tantytm.blogspot.com' style='20'>Free File Hosting</a><a href='http://gubhugreyot.blogspot.com/2010/07/tag-cloud-cumulus-full-color-buat-dan.html' style='18'>Tag Cloud Cumulus</a><a href='http://gubhugreyot.blogspot.com' style='9'>More than 400 Tutorial</a><a href='http://bgsgr.blogspot.com' style='14'>Full CSS3</a><a href='http://gubhugreyot.blogspot.com' style='20'>Tips Trik Blogger</a><a href='http://gubhugreyot.blogspot.com' style='12'>Javascrip-jQuery</a><a href='http://gubhugreyot.blogspot.com' style='18'>Animasi GIF</a></tags>");
so.write("flashcontent");
</script>
</div>

Keterangan:

  1. Perhatikan kode yang seperti ini:
    "tagcloud", "200", "200", "7", "#ddeefe");
    Angka 200 (merah) untuk mengatur lebar tag cloud, 200 (oranye) untuk mengatur/merubah tinggi tag cloud dan #ddeefe adalah warna background tag cloud (rubah kode untuk merubah warna background). Jika ingin warna tag cloud transparant, hapus tanda //pada kode so.addParam(”wmode”, “transparent”);
  2. tcolor dan tcolor2 (0x0307bc dan 0x138002) berfungsi untuk merubah warna teks link.
  3. hicolor ==> hicolor“, “0xfb3f1a“); untuk mengatur warna hover link.
  4. so.addVariable(”tspeed”, “100“); angka 100 merupakan nilai pengaturan kecepatan gerak teks link tag cloud.
  5. Penulisan dan penyusunan link sangat mempengaruhi keberhasilan pembuatan tag cloud. Link harus dibuat berdeeret tanpa putus di mulai dari kode pembuka <tags> hingga kode penutup </tags>seperti di bawah ini:
    <tags><a href=’http://gubhugreyot.blogspot.com‘ style=’22′ color=’0xf602ff’ hicolor=’0×0c03c9′>gubhug reyot</a><a href=’http://gubhugreyot.blogdetik.com‘ style=’16′>GR blogDETIK</a><a href=’http://gubhugreyot.blogspot.com‘ style=’16′>Modifikasi Template</a><a href=’http://bloggerstuars.blogspot.com‘ style=’14′>Menu Masakan</a><a href=’http://tantytm.blogspot.com‘ style=’20′>Free File Hosting</a><a href=’http://gubhugreyot.blogspot.com/2010/07/tag-cloud-cumulus-full-color-buat-dan.html‘ style=’18′>Tag Cloud Cumulus</a><a href=’http://gubhugreyot.blogspot.com‘ style=’9′>More than 400 Tutorial</a><a href=’http://bgsgr.blogspot.com‘ style=’14′>Full CSS3</a><a href=’http://gubhugreyot.blogspot.com‘ style=’20′>Tips Trik Blogger</a><a href=’http://gubhugreyot.blogspot.com/search/label/Tutorial%20Blogger‘ style=’12′>Tutorial Blogger</a><a href=’http://gubhugreyot.blogspot.com‘ style=’18′>Animasi GIF</a></tags>
    Perhatikan pada kode di atas:
    Warna hitam ==> link blog/web/situs lain.
    Warna Hijau ==> Teks Link
    Warna Merah ==> Link Posting
    Warna Oranye == > Link Kategori
  6. Simpan seluruh kode dalam template melalui Widgetize Any HTML yang dapat diakses melalui halaman Dasbor.
  7. Untuk mengikuti panduan cara memasang atau menyimpan kode HTML seperti halnya tag cloud di atas KLIK link panduan di bawah ini:
Keterangan/Catatan:
  1. Dalam link di atas akan dijumpai cara pemasangan Javascript Energy Saving Mode.
  2. Cara penyimpanan kode tak berbeda antara Kode CSS, javascript ataupun xHTML, oleh karena itu ikuti panduan tersebut dengan seksama.
  3. Pada langkah Nomor 6 diperlihatkan contoh penempatan javascript dalam box Widgetize Any HTML. Lakukan cara yang sama akan tetapi yang dimasukkan dalam box dan disimpan adalah kode HTML Tag Cloud Cumulus (xHTML dan javascript).
  4. Jika ada sebuah box Widgetize Any HTML yang sebelumnya telah digunakan untuk menyimpan kode CSS, javascript ataupun xHTML seperti misalnya Energy Saving Mode, Kode CSS Favicon Address Bar ataupun yang lain, maka silahkan simpan xHTML dan Javascriptdi atas atau di bawah kode kode yang telah tersimpan di dalamnya.Jadi pada dasarnya dalam satu box Widgetize Any HTML dapat digunakan secara berulang-ulang dengan berbagai macam dan fungsi kode.
  5. Jika Tag Cloud akan dipasang di sidebar yang lain, buat terlebih dahulu 1 buah Widgetize Any HTML baru pada sidebar dimaksud. Cara membuat sama dengan langkah pada pembuatan Widgetize Any HTML saat pembuatan Energy Saving Mode.
  6. Pasang link dan teks link-nya sebanyak anda suka. He … he … rumah sampeyan mo di masukkan juga? Hiii … hiii boleh … boleh … Biar tidurnya di blogdetik sekalian, he …

Tag Cloud Cumulus dengan Background-image

Setelah sukses dengan tag cloud di atas, sampeyan boleh juga untuk mencoba yang di bawah ini. Tidak banyak perbedaan, hanya tag cloud ini dilengkapi background image yang cukup cantik!
<div style="height:172px;width:222px;margin:0px auto;overflow:hidden !important;float:none;text-align:center;background:#fff url(bg-image_Cumulus.gif) center no-repeat;">
<script type="text/javascript" src="http://h1.ripway.com/santyeka/Javascript/bgsGR_cumulus.js"></script>
<div id="flashcontent" style="font-size;18px;font-weight:bold;color:yellow;">gubhug reyot</div>
<script type="text/javascript">
var so = new SWFObject("http://www.swfcabin.com/swf-files/1275932799.swf", "tagcloud", "200", "176", "7", "#666666");
so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x01fefb");
so.addVariable("tcolor2", "0xfcc283");
so.addVariable("hicolor", "0xe7fc03");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><a href='http://gubhugreyot.blogspot.com' style='22' color='0xffffff' hicolor='0x00cc00'>WordPress</a><a href='http://gubhugreyot.blogdetik.com' style='16'>Flash</a><a href='http://gubhugreyot.blogspot.com' style='16'>Plugin</a><a href='http://bloggerstuars.blogspot.com' style='14'>WP-Cumulus</a><a href='http://tantytm.blogspot.com' style='20'>3D</a><a href='http://gubhugreyot.blogspot.com' style='18'>Tag cloud</a><a href='http://gubhugreyot.blogspot.com' style='9'>Roy Tanck</a><a href='http://bgsgr.blogspot.com' style='14'>SWFObject</a><a href='http://gubhugreyot.blogspot.com' style='20'>Example</a><a href='http://gubhugreyot.blogspot.com' style='12'>Click</a><a href='http://gubhugreyot.blogspot.com' style='18'>Animation</a></tags>");
so.write("flashcontent");
</script>
</div>
Ganti terlebih dahulu bg-image_Cumulus.gif, dengan :

==>http://i964.photobucket.com/albums/ae124/gubhugreyot/imageloading/BgsGR-bgLoader.gif

Comments

Popular posts from this blog

Counter Strike Extreme V7 Remake by Bricks_966

Title: COUNTER-STRIKE XTREME V7 Released: 2013 Genre: Action (Shooter), 3D, 1st Person Developer: bluelytning Publisher: CS-XTREME.ORG Translation: Bricks_966 Language: Russian Language: English Publication Type: pirates Tablet: Not required. Description: I present you the new version of the game - Counter-Strike Xtreme v7. Now added more than 60 new models of weapons and the players that can not but rejoice. The game has changed beyond recognition in the store became available new weapons and players that make the game even brighter and more exciting. Also changed logos, textures, sprites and sounds. But with new features, new, specific requirements for rail component of your computer. Counter-Strike Xtreme v7 is markedly different from previous builds the world-famous fashion Half-Life. The first thing that catches your eye - it's graphics. It has become more colorful through changes in the composition of new t

Counter Strike Extreme Ultimate by Bluelytning

Title: COUNTER-STRIKE XTREME ULTIMATE Released: 2013 Genre: Action (Shooter), 3D, 1st Person Developer: bluelytning Publisher: CS-XTREME.ORG Translation: bluelytning Language: English Language: English Publication Type: pirates Tablet: Included Features COUNTER-STRIKE XTREME ULTIMATE: 1. New Menu Launch 2. New maps and full radar system cards 3. New Modes 4. New weapons now available to all and always 5. Full gun shop 6. Weapons heroes now available 7. New models Yuri & Alice Casual 8. Updated scoreboard 9. Life zombies and updated hero 10. New Animation & Effect and many, many other upgrades! * Tested in Windows Xp Sp3 * Source : http://cs-xtreme.org/forum/2-49-1 * DOWNLOAD 

Counter Strike Point Blank Non NST

========================================================================= UPDATE !!! PATCH FOR CSPB NON NST Info: Patch diinstall jika CSPB dipasang STEAM ! Link: Mediafire 17.7 MB ========================================================================= NEW PATCH 18 June 2012 FOR CSPB NON NST Credits: DavidJr Fe Ar Padli Koesmayadi Arif Super Insurgent KeenHide Syahrul Ramdhan Allied Modder Link: Mediafire 1.41 MB ========================================================================= Tutor how to install patch 1. Buka patchnya lalu arahkan ke folder CSPB Non NST 2. Jika keluar dialog seperti ini, tekan Yes to all: Tester: DavidJr Progress project bisa dilihat di: CSF Project Produced by CSPB Team under Counter Strike Federation Foundation Copyright. Counter Strike Point Blank is a trademark of Counter Strike Federation & Valve Trademark Please note this: Do not reupload ! Do not post any direct link ! Copyright © 2012 C