Tips Blogger Zacky

Lytebox Image Viewer for Blogger (fixed)

2010-03-06T13:47:00.013+07:00

Lytebox adalah sebuah lightbox yang dibuat untuk menampilkan suatu objek secara mandiri dengan menghapus ketergantungan prototype.js, effects.js, dan scriptaculous.js. Sejak versi asli Lytebox yang dibuat oleh Lokesh Dhakar (yang dirilis dengan dukungan iFrame) dibuat, modifikasi besar telah dilakukan untuk meningkatkan kinerjanya sebaik mungkin dan juga "Sildeshow", "Tema", dukungan konten HTML (sebagai lawan dari hanya gambar) dan masih banyak lagi pilihan yang dapat dikonfigurasi yang memungkinkan Anda untuk menyesuaikan tampilan dan nuansa Lytebox. (ini intro yang saya kutip dari Dolem)

Anda mungkin sudah pernah (saya juga) membaca tips tentang cara memasang lytebox di blog-blog lain. Saat pertama membaca dan melihat demonya, Lytebox berjalan dengan baik. Namun beberapa hari setelah itu sampai sekarang, Lytebox yang berasal dari trik blog-blog tersebut tidak berfungsi lagi. Saya berpikir itu karena hostingan tempat menaruh script nya sudah melewati batas bandwitch, jadi saya coba upload script tersebut ke hostingan baru, namun hasilnya tetap sama. Huft, pusing juga. Apa penyebabnya?

Karena saya sangat penasaran dengan Lytebox ini, saya coba mengutak-atik kode css dan javascript nya. Setelah memakan waktu kurang lebih 5 jam, akhirnya usaha saya untuk bertahan di depan monitor pun membuahkan hasil. Lytebox yang saya masukkan ke bengkel html saya (Macromedia Dreamweaver 8) berjalan sesuai dengan rencana.

Lytebox yang akan saya jelaskan ini adalah Lytebox v3.22. Di postingan sebelumnya tentang Lightbox, yaitu Facebox, Lytebox menggunakan prototype sebagai pengendali akitifitasnya sedangkan Facebox mengandalkan jQuery.
Berikut beberapa fitur v3.22 :
- Menampilkan satu gambar
- Menampilkan gambar-gambar dalam satu grup
- Membuat slideshow
- Menampilkan halaman atau link eksternal, bisa untuk satu link atau link dalam sebuah grup

Gimana menarik kan? Mau tau cara membuatnya? ("ah, dari tadi kek, kebanyakan ceramah nih si zacky", jawab si pembaca)

Berikut Cara Memasang Lytebox di Blogger / Blospot

1. Memasang kode CSS dan Javascript
- Pilih Layout > Edit HTML
- Cari kode </head>, lalu paste kode berikut di atasnya:

<script src='http://doigirls.megabyet.net/lytebox/lytebox.js' type='text/javascript'></script>
<link href='http://doigirls.megabyet.net/lytebox/lytebox.css' media='screen' rel='stylesheet' type='text/css'/>

- Klik Save Template

2. Penerapan Lytebox
Seperti yang sudah saya jelaskan tadi, Lytebox bisa digunakan untuk menampilkan satu gambar atau lebih, membuat slideshow, dan menampilkan halaman eksternal. Anda bisa menggunakannya di postingan atau di Page Element template anda.
Berikut kode-kode pengaplikasian Lytebox:

- Menampilkan Satu Gambar

<a title="JUDUL LINK" href="URL-GAMBAR" rel="lytebox"><img src="URL-GAMBAR" style="width:320px;height:240;border:0" /></a>

demo » klik disini

- Menampilkan Beberapa Gambar Dalam Satu Grup

<a title="JUDUL LINK 1" href="URL-GAMBAR-1" rel="lytebox[grup]"><img src="URL-GAMBAR-1" style="width:320px;height:240;border:0" /></a>

<a title="JUDUL LINK 2" href="URL-GAMBAR-2" rel="lytebox[grup]"><img src="URL-GAMBAR-2" style="width:320px;height:240;border:0" /></a>

<a title="JUDUL LINK 3" href="URL-GAMBAR-3" rel="lytebox[grup]"><img src="URL-GAMBAR-3" style="width:320px;height:240;border:0" /></a>

<a title="JUDUL LINK 4" href="URL-GAMBAR-4" rel="lytebox[grup]"><img src="URL-GAMBAR-4" style="width:320px;height:240;border:0" /></a>

demo » klik disini

- Membuat Slideshow

<a title="JUDUL LINK 1" href="URL-GAMBAR-1" rel="lyteshow[slideshow]"><img src="URL-GAMBAR-1" style="width:320px;height:240;border:0" /></a>

<a title="JUDUL LINK 2" href="URL-GAMBAR-2" rel="lyteshow[slideshow]"><img src="URL-GAMBAR-2" style="width:320px;height:240;border:0" /></a>

<a title="JUDUL LINK 3" href="URL-GAMBAR-3" rel="lyteshow[slideshow]"><img src="URL-GAMBAR-3" style="width:320px;height:240;border:0" /></a>

<a title="JUDUL LINK 4" href="URL-GAMBAR-4" rel="lytebox[slideshow]"><img src="URL-GAMBAR-4" style="width:320px;height:240;border:0" /></a>

demo » klik disini

- Menampilkan Halaman Eksternal
1. Satu Halaman Eksternal

<a title="JUDUL HALAMAN EKSTERNAL" href="URL-HALAMAN-EKSTERNAL" rel="lyteframe" rev="width:640px;height:380px;scrolling:auto">Google Search</a>

demo » klik disini

2. Beberapa Halaman Eksternal Dalam Satu Grup

<a title="JUDUL HALAMAN EKSTERNAL-1" href="URL-HALAMAN-EKSTERNAL-1" rel="lyteframe[external]" rev="width:640px;height:380px;scrolling:auto">Google Search</a>

<a title="JUDUL HALAMAN EKSTERNAL-2" href="URL-HALAMAN-EKSTERNAL-2" rel="lyteframe[external]" rev="width:640px;height:380px;scrolling:auto">Yahoo! Search</a>

<a title="JUDUL HALAMAN EKSTERNAL-3" href="URL-HALAMAN-EKSTERNAL-3" rel="lyteframe[external]" rev="width:640px;height:380px;scrolling:auto">Bing Search</a>

demo » klik disini

Keterangan:
1. http://doigirls.megabyet.net/lytebox/ adalah tempat hostingan script Lytebox.
Silahkan download source Lytebox v3.22 disini. Ekstrak source Lytebox v3.22 dan upload ke hostingan anda, letakkan ke satu folder. Ingat!, url gambar backgroud yang ada di dalam lytebox.css, misalnya images/close_grey.png tidak perlu anda ganti, karena file tersebut sudah berada folder yang sama. Saya sarankan anda memilih hostingan untuk free web hosting yang yang memiliki batasan bandwitch yang besar, untuk hal ini saya rekomendasikan anda untuk memilih Megabyet Internet. "Inilah rahasia berjalannya Lytebox".

2. title="JUDUL LINK" dan title="JUDUL HALAMAN EKSTERNAL" sangat berguna untuk Lytebox karena JUDUL LINK dan JUDUL HALAMAN EKSTERNAL tersebut akan muncul di sebelah kanan bawah Lytebox dan gunanya untuk memberi informasi tentang gambar apa yang sedang dilihat oleh pengunjung.

3. style="width:320px;height:240;border:0" berfungsi untuk mengatur ukuran tampilan sebelum masuk ke Lytebox, karena sangat tidak efisien jika kita menampilkan ukuran sebenarnya di blog sedangkan kita telah menggunakan Lytebox sebagai image viewer.
Misalnya ukuran gambar anda adalah 800x600 pixel, maka ganti kode width:320px;height:240 menjadi width:400px;height:300px sehingga gambar yang muncul di blog berukuran 400x300 pixel.

4. rel="lytebox" berfungsi untuk memanggil kode javascript yang anda pasang. Kode ini tidak perlu diganti!

5. rel="lytebox[grup]" , kode grup berfungsi sebagai id pengelompokkan gambar. Kode ini bisa anda ganti sesuai keinginan.

5. rel="lytebox[slideshow]" , kode slideshow berfungsi sebagai id pengelompokkan gambar untuk menampilkannya ke dalam sebuah Slideshow. Kode ini bisa anda ganti sesuai keinginan.

6. rel="lyteframe" berfungsi untuk memanggil kode javascript yang anda pasang. Kode ini tidak perlu diganti!

7. rel="lyteframe[external]" , kode external berfungsi sebagai id pengelompokkan halaman eksternal. Kode ini bisa anda ganti sesuai keinginan.

8. rev="width:640px;height:380px;scrolling:auto" berfungsi untuk mengatur ukuran Lytebox yang menampilkan halaman ekternal. Kode width:640px;height:380px bisa anda ganti sesuai keinginan.

9. Jika anda ingin memasangnya di postingan, maka lakukan pembuatan postingan di tab edit Html. Jika anda ingin memasangnya di template blog, maka tambahkan Page Elements dengan HTML/Javascript.

Huft, akhirnya selesai juga... Demo Lytebox bisa anda lihat disini.
Jika anda memiliki keraguan, kotak komentar di bawah ini akan menerima anda dengan senang hati..

Oya, sebelum postingan ini sampai di tanda titik yang terkahir, mari sama kita berterima kasih kepada:
1. Lokash Dhakar, sang penemu Lytebox

2. Dolem Lytebox, sang editor Lytebox

3. Megabyet Internet, hostingan saya

4. Macromedia Dreamweaver 8, bengkel web designer saya

5. Terakhir, tentunya kepada saya sendiri (Zacky Adrihayuni), wuahahahahaha...!

Semoga berhasil...

Social Bookmarking Widget Untuk Homepage

2010-03-04T20:10:00.015+07:00

Anda semua tentu sudah paham bahwa saat ini situs-situs social bookmark atau jejaring sosial sangat berperan penting dalam hal meningkatkan trafik blog. Dengan mengirim, membagikan, atau menyimpan link di situs tersebut, kita akan mendapatkan pengunjung yang lebih banyak dan membuat mereka akan selalu mengunjungi blog kita.

Dibeberapa postingan sebelumnya, saya telah menjelaskan cara-cara untuk mengirim url postingan dengan mudah ke situs social bookmark, di antaranya Widget Sharing & Bookmarking, Widget Share the Love, Share on Facebook, dan terakhir widget buatan saya sendiri yaitu TBZ-Bookmarking Widget. Semua widget tersebut difokuskan untuk mengirim url postingan saja. Nha, kali ini saya akan menjelaskan cara membuat widget social bookmarking untuk membagikan url homepage blog. Dengan widget ini, kita bisa mengirim url homepage blog kita ke Facebook, Twitter, Digg, Stumbleupon, Linkedin, Yahoo Bookmarks, Google Bookmarks, Reddit, Mixx, Technorati, dan yang terkahir ke Google Buzz. Mau?

Berikut Cara Membuat Social Bookmarking Widget untuk Homepage

1. Login ke akun Blogger anda

2. Pilih Layout > Page Elements

3. Tambahkan Page Elements dengan HTML/Javascript, lalu paste kode di bawah ini ke dalam kotak content.

<a href="http://www.facebook.com/share.php?u=http://blogger-driver.blogspot.com" target="_blank" title="Share on Facebook"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxmClOjG-xdoAsCuYJ6gUe22i6pWPgwwS-gaL90BXAhicOpTY_OExrcCFVTbmx1u47WJDlW8dM5HsgScv4mERwFFK5hJi-qDpV5LpdIowEgSSqY76wOchetvm3OjAfV9wjbMIUHhKM4VU/s400/facebook_32.png" border="0" alt="Facebook" /></a>

<a href="http://twitter.com/home?status=I%20am%20currently%20on:%20Blogger%20Driver%20-%20http://blogger-driver.blogspot.com.%20It's%20a%20great%20blogging%20tips" target="_blank" title="Tweet It!"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihYxBTBwXx_sYlKnJbdbGSWGLxOB_fSt0jCFJ6AqFf1vETMr3W5PhCSFsuVCsRcmMBnstNm2t1OKnxCmurAL54OAqBvwgbPaPhdoZNgiMMLu9gV-rmko-WYL86smmXITr7ZgvEJV8w51c/s400/twitter_32.png" border="0" alt="Twitter" /></a>

<a href="javascript:var%20b=document.body;var%20GR________bookmarklet_domain="http://www.google.com";if(b&&!document.xmlVersion){void(z=document.createElement("script"));void(z.src="http://www.google.com/reader/ui/link-bookmarklet.js");void(b.appendChild(z));}else{}" title="Buzz This!"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjY3TuoOt5PEnXSQicje9AfqHHz5F0D6JLefjIaw9NpVJdW006EB-KdsTONEEmiNC5_HZIT738vmx6u0VEPz7r5ImnzN7-oxWM_N04iKqcVNGT8z32M8e99NPLsgQHY4VxcQ3vCjKQrZ94/s400/googlebuzz.png" border="0" alt="Google Buzz" /></a>

<a href="http://del.icio.us/post?url=http://blogger-driver.blogspot.com&title=Blogger%20Driver" target="_blank" title="Bookmark to Delicious"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk0fI9Gd19xAlY4cQcdqzgP006KkCqpzhyphenhyphen21U_xLGMjoyu5W2zIu3sKFuHzRRBN2yKUTicVKot4_7fSQEawT_gUjXOPK5_5b8ZbYsESzQJhDi4MW7DMIX7fKo-aj73Me8-tEywkxsZoUg/s400/delicious_32.png" border="0" alt="Delicious" /></a>

<a href="http://del.icio.us/post?url=http://blogger-driver.blogspot.com&title=Blogger%20Driver" target="_blank" title="Digg It!"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbxQ7BVIMoyNlqGqqDyzqYhOC1i7x4xZrKaepSm6NVGvwbXI7_qcXjF7n5E8jwbzKr9VUlP4XfAZ_C2FdOnjMxVuykFlhA5YnGz_OsZaqZkF8lkr69tyUYrlqCECXd_a7XJR6-dyOXo1I/s400/digg_32.png" border="0" alt="Digg" /></a>

<a href="http://www.stumbleupon.com/submit?url=http://blogger-driver.blogspot.com&title=Blogger%20Driver" target="_blank" title="Stumble it!"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8N-21fo0KHGvRd4DfhsBcS2yaMb2wezg5J6mLZc1KcALuOCSVxG-zqO0Go2BEOrIQQRb_rZprQSeHUCTkhcw9wFwyNcOcznunfkzYpE8UY5FA95qM6doKIFDBOMYstJz50irrUxCakNs/s400/stumbleupon_32.png" border="0" alt="Stumbleupon" /></a>

<div style="clear:both;height:0"></div>

<a href="http://www.linkedin.com/shareArticle?mini=true&url=http://blogger-driver.blogspot.com&title=Blogger%20Driver" target="_blank" title="Share on Linkedin"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrcIc2wXl6YyUYKiMBENp64xC4Lx4g1PKxrE08EPePROzHtpjPMBLNPEVwbs3D-CeBFRIyidI5cJojPWNS4BhMMxtAGYfumJku4IMB3lg-_Bn9XDhaDJx1Ll-hiYW3Ud-CjJojiIW1HTo/s400/linkedin_32.png" border="0" alt="Linkedin" /></a>

<a href="http://myweb2.search.yahoo.com/myresults/bookmarklet?u=http://blogger-driver.blogspot.com&=Blogger%20Driver" target="_blank" title="Bookmark to Yahoo! Bookmarks"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiRNYczWB6Qd4zRAx6Fr-x30UjcNbbQqjKJnI5i6kpZk7TrrIOsF73iKBYSDTUVOfdYlLvqAwXcxNwQo0YzDMdwOKvJvUR7ZjYep8pHesL5GF_uinuR33WMrTtKJfbrrEgm96jzOBwbdM/s400/yahoo_32.png" border="0" alt="Yahoo! Bookmarks" /></a>

<a href="http://www.google.com/bookmarks/mark?op=add&bkmk=http://blogger-driver.blogspot.com/&title=Blogger%20Driver" target="_blank" title="Bookmark to Google Bookmarks"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaIkNU_Nkw5sSRz1zaewvQb6MECHjWfG2FcfMPw32YFqatLHEWQeeayazm80PWF3ncoxpUC7bk3iqWiQuNck3Alcb9kkt5rsmQXkmmdDv__Y82Bsm2DX5JnDx7yGM43IVSOz7SrcuHWVw/s400/google_32.png" border="0" alt="Google Bookmarks" /></a>

<a href="http://reddit.com/submit?url=http://blogger-driver.blogspot.com/&title=Blogger%20Driver" target="_blank" title="Reddit"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZDxpx6n9LZzy15v4Rq8tEWb-tfQnMqJdmZUe1E-9pvGZrKWb2E4ZVOI82ov4s76i-fKGi71X1iU6Oi-gNYqsRNNPxsJaebeP02azyjXwH5ZYky-BewzdnGYBKHbp4-1Jv9KHCcPK549g/s400/reddit_32.png" border="0" alt="Reddit" /></a>

<a href="http://www.mixx.com/submit?page_url=http://blogger-driver.blogspot.com" target="_blank" title="Share on Mixx"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9mRj-GiaXr2Ufldm_NBCf_aSrAFpI6p2ijurH7anpvIRCijTzpjxkAr5-ECTzM4cWubjD4QyXe4r31Krgd0ZnEMJvdha8ZzUKaoAtjx7zEbaHf9oLCTot5AR5oOw9pgfVV7oEpRnF1RQ/s400/mixx_32.png" border="0" alt="Mixx" /></a>

<a href="http://technorati.com/faves?add=http://blogger-driver.blogspot.com&title=Blogger%20Driver" target="_blank" title="Fave this to Technorati"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhceucateyJLN0gb_lNnsHt84-9M1eO4zWZ4A2R7UZ7HK_esfzOMngIXtoPbFs4Z5NaELNEwHvbmKyumsj7iGG-CBhWrFv2ztXkj_TFg5lTv8l_iOVShmc9qdF9ssQAnTtyIOe-v3-QEOM/s400/technorati_32.png" border="0" alt="Technorati" /></a>

Keterangan:
- Ganti tulisan yang bercetak tebal dengan url dan nama blog anda
- Jika judul atau nama blog anda lebih dai satu kata, maka gunakan kode %20 sebagai pengganti spasi, misal "Blogger%20Driver" (tanpa tanda kutip)
- Saya sarankan anda meletakkan widget ini di bagian sidebar paling atas supaya mudah dilihat oleh pengunjung

4. Terkahir, klik Save Template.

Untuk demonya bisa anda lihat disini.

Selamat mencoba...

Cara Membuat Script Redirect URL

2010-03-03T14:19:00.011+07:00

Redirect URl berfungi untuk mengalihkan url awal yang diklik atau dituju oleh pengunjung ke url yang ditentukan. Script ini sudah saya pakai ketika url blog Tips Blogger Zacky yang lama (http://tips-blogger-zacky.blogspot.com) bermasalah dalam SEO nya. Karena tidak tahu apa masalahnya, sempat terpikir untuk membuat blog baru dengan nama yang baru juga. Saya sangat pusing, tak tahu apa yang harus dilakukan.

Sebenarnya url blog bisa saja diganti pada tab Settings akun Blogger, namun itu sangatlah merugikan karena url http://tips-blogger-zacky.blogspot.com sudah mendapat PR 2 dan Alexa Traffic Rank sudah mencapai 600an. Ditambah lagi semua url postingan sudah adem ayem nongkrong di beberapa blog directory, forum, dan beberapa situs social bookmark. Gimana nih caranya?, tanya saya kepada mbah Google. Saya dikasih solusi yang baik, tepat, dan tidak merugikan, yaitu dengan membiarkan url lama tetap eksis dan membuat url baru.

Saya memasang script redirect url ke url baru (http://tipsbloggerzacky.blogspot.com) pada template url lama (http://tips-blogger-zacky.blogspot.com). Sebagai hasilnya, silahkan anda klik url blog yang lama disini. Gimana? Langsung diarahkan balik ke http://tipsbloggerzacky.blogspot.com kan?
Nha, kali ini saya akan membagikan tips memasang script redirect url tersebut untuk anda yang memiliki masalah yang sama dengan saya. Mau?

Sebelum kita masuk ke kode untuk membuat scipt ini, ada beberapa hal yang harus anda perhatikan, yaitu:

1. Backup terlebih dahulu blog anda
Caranya mudah, masuk ke tab Settings > Basic. Lihat tulisan Blog Tools, disampinya terdapat tiga opsi: Import blog - Export blog - Delete blog. Pilih Export blog lalu klik DOWNLOAD BLOG, maka semua postingan anda akan tersimpan dalam sebuah file .xml. Jangan hapus postingan blog lama.

2. Buat blog baru dengan nama yang sama dengan blog lama anda, usahakan url barunya hampir sama dengan url baru.

3. Edit semua data di blog directory tempat anda submit url lama.

Sudah, sekarang mari kita masuk ke kodenya..

Berikut Cara Membuat Script Redirect Url

1. Login ke akun Blogger anda.

2. Pilih Layout > Edit HTML (ingat, pilih settingan ini untuk blog anda yang lama)

3. Cari kode <head>, lalu paste kode berikut di bawahnya:

<meta content='nofollow' name='robots'/>
<meta content='noindex' name='robots'/>

<script type='text/javascript'><![CDATA[//><!]]></script>
<meta content='0;URL= http://tipsbloggerzacky.blogspot.com/' http-equiv='refresh'/>

Keterangan:
- Kode meta tags di atas berguna supaya blog yang lama tidak diinidex lagi oleh search engine (Google, Yahoo, Bing), jadi blog baru anda tidak akan disangka blog jiplakan.
- Ganti http://tipsbloggerzacky.blogspot.com dengan url blog baru anda.

4. Terakhir, klik Save Template.

Supaya tampilan blog lama anda menjadi kosong atau muncul sedikit pesan tentang pengalihan url, anda harus menghapus semua isi tag body dan memngisinya dengan yang baru.
Begini caranya:

1. Pastinya anda masuk ke Layout > Edit HTML, tidak perlu mencentang Expand Widget Templates.

Misalnya isi template anda seperti ini:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<b:skin><![CDATA[/*
-----------------------------------------------
Nama : Blog ini gak ada gunanya lagi, wuahahahahaaa!!!!
----------------------------------------------- */
#navbar, #navbar-iframe {height:0;visibility:hid ...............
...............
...............
...............
]]></b:skin>

</head>

<body>
...............
...............
...............
</body>

</html>

2. Pertama, hapus dulu semua kode css template. Perhatikan tanda titik-titik diantara kode ----------------------------------------------- */ dan ]]></b:skin>, hapus kode css template anda sehingga kodenya hanya tinggal seperti ini:

----------------------------------------------- */

]]></b:skin>

3. Kedua, hapus isi tag body. Perhatikan tanda titik-titik diantara kode <body> dan </body>, hapus isi tag body anda sehingga kodenya hanya tinggal seperti ini:

<body>

</body>

4. Untuk menambahkan pesan pengalihan url, caranya:
- Paste kode berikut di atas kode ]]></b:skin> :

#navbar, #navbar-iframe {height:0;visibility:hidden;display:none}
body {
background: #FFF;
font:12px Arial, Helvetica;
color: #333
}
#wrap {
background:transparent;
width:980px;
margin:100px auto 10px;
padding-top:2px;
position:relative;
text-align:center;
}

- Paste kode berikut di atas tag </body> :

<div id='wrap'>

<a href='http://tips-blogger-zacky.blogspot.com' target='_blank'><img border='0' src='http://i46.tinypic.com/33mvn7d.jpg'/></a>

<h2><a href='http://tipsbloggerzacky.blogspot.com'>TIPS BLOGGER ZACKY</a></h2>
<h2>HAS BEEN MOVED TO:</h2>

<h1><a href='http://tipsbloggerzacky.blogspot.com'>http://tipsbloggerzacky.blogspot.com</a></h1>

<a href='http://tipsbloggerzacky.blogspot.com'>Click here if browser doesn't redirect you automatically...</a>

</div>

Silahkan ganti tulisan yang dicetak tebal.

5. Terakhir, klik Save Template

Selesai sudah ceramah saya untuk hari ini, jika ada pertanyaan silahkan berkomentar, mumpung Blogger.com belum banned para spammers, hahahaha...

Selamat mencoba...

Cara Memasang Tombol Google Buzz di Blog

2010-03-01T15:14:00.012+07:00

Seperti yang kita ketahui, pada tanggal 9 Februari kemarin Google telah meng-upgrade Gmail dan menyulapnya menjadi sebuah situs social network atau jejaring sosial, yaitu menggabungkannya dengan sebuah layanan yang disebut Google Buzz. Google mengaku menciptakan layanan ini untuk menandingi 2 situs jejaring sosial yang sangat populer saat ini yaitu Facebook dan Twitter. Meski banyak pihak yang mengatakan bahwa Google Buzz ini merupakan hasil tiruan Yahoo Buzz yang telah lama muncul, namun sang penemu Google, Sergey Brin tampak optimis bahwa Google Buzz akan meraih kesuksesan.

Sama halnya dengan Facebook, pengguna Google Buzz juga dapat meng-update status yang mereka pikirkan dan pengguna lian juga dapat mengomentarinya. Google Buzz juga dapat menampilkan foto, video, dan link ke sebuah situs atau blog. Untuk dapat menggunakan Google Buzz, tentunya anda harus memiliki akun Gmail terlebih dahulu. Klik disini untuk mendaftar ke Gmail.

Sudah cukup muqodimahnya, sekarang mari kita masuk ke topik utama pembahasan kita kali ini, yaitu tentang cara memasang tombol Google Buzz di blog sebagai fasilitas sharing baru.

Dengan menggunakan tombol Google Buzz di blog, kita bisa dengan mudah membagikan atau mem-buzz artikel kita ke Gmail sehingga dapat dilihat oleh orang lain. Jika kita klik tombol tersebut, maka akan keluar sebuah pop-up window. Hal yang menarik disini adalah kita bisa memilih bagian manapun dari halaman dengan mengunakan cursor mouse anda, teks atau foto akan ditambahkan ke deskripsi Buzz anda. Sebagai contoh, silahkan anda klik tombol Buzz yang ada di bagian bawah postingan ini.

Ada 2 pilhan untuk tombol Buzz, yaitu icon besar dan icon kecil. Kodenya:

1. Icon Besar

<a href='javascript:var%20b=document.body;var%20GR________bookmarklet_domain="http://www.google.com";if(b&&!document.xmlVersion){void(z=document.createElement("script"));void(z.src="http://www.google.com/reader/ui/link-bookmarklet.js");void(b.appendChild(z));}else{}'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5_tWi5n4dsZpQzbR4M08-7LwEGgwISrpzy_f4IGBjGoC1XPPq4o5i0qtpz8YEhINQzSzuggejmsuc4U9vgfePAK2LdSccvVbBuj66RzPDCLh2pspYayhduLFf76MU0rCvpZ5mw3cOejk/s400/googlebuzz.png" border="0"/></a>

2. Icon Kecil

<a href='javascript:var%20b=document.body;var%20GR________bookmarklet_domain="http://www.google.com";if(b&&!document.xmlVersion){void(z=document.createElement("script"));void(z.src="http://www.google.com/reader/ui/link-bookmarklet.js");void(b.appendChild(z));}else{}'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_6gONL78q4La_aRQilZBcGea_bdUNsJ9zyZNRwYVAJ9v_H2AIcQNKPkrtfHOsFIRHtrxQJDNUCmB0oyKjHKKE7LEtF5dNDe2Q4r-8pCRJUpVHWD-glAHlAD4PWWTRSmG0JWlQyBMlRJg/s400/buzzthis.gif" border="0" alt="Buzz this!"/></a>

Berikut Cara Memasangnya di Template anda:

1. Login ke akun Blogger

2. Pilih Layout > Edit HTML, lalu centang Expand Widget Templates

3. Cari kode <data:post.body/>, lalu paste kode icon Buzz yang anda suka tepat di atasnya, sebagai contoh:

<a href='javascript:var%20b=document.body;var%20GR________bookmarklet_domain="http://www.google.com";if(b&&!document.xmlVersion){void(z=document.createElement("script"));void(z.src="http://www.google.com/reader/ui/link-bookmarklet.js");void(b.appendChild(z));}else{}'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5_tWi5n4dsZpQzbR4M08-7LwEGgwISrpzy_f4IGBjGoC1XPPq4o5i0qtpz8YEhINQzSzuggejmsuc4U9vgfePAK2LdSccvVbBuj66RzPDCLh2pspYayhduLFf76MU0rCvpZ5mw3cOejk/s400/googlebuzz.png" border="0"/></a>
<data:post.body/>

Jika anda ingin meletakkannya di bagian bawah postingan, maka cari kode <div class='post-footer'/>, lalu paste kode icon Buzz tepat di bawahnya.

4. Terakhir, klik Save Template.

Selamat mencoba...

Remix Zone Blogger Template

2010-02-28T16:50:00.007+07:00

Demo | Download
- 2 kolom, sidebar kanan
- fixed width, 2 sidebar
- Gallery Blogger Template

Author: Anshuldudeja
Instalasi: Klik disini
Credit: AllBlogTools.com

Melitus Blogger Template

2010-02-28T16:47:00.010+07:00

Demo | Download
- 2 kolom, sidebar kanan
- Fixed width, 1 sidebar
- Magazine Blogger Template

Author: Blogger Template Place
Instalasi: Klik disini
Credit: AllBlogTools.com

Cara Membuat Script Bookmark Site

2010-02-27T19:23:00.004+07:00

Selamat malam semuanya... Maaf lama tak update dan posting seputar tips blogging. Soalnya belakangan ini saya bantu teman bikin blog, dan saya juga bikin blog baru, yaitu IndoGals (promosi nih, hehehe...), jangan lupa visit ya...

Nha, untuk tips pembuka setelah beberapa lama vakum yaitu cara membuat script bookmark site. Anda mungkin sudah pernah melihat blog atau situs yang di bagian atasnya terdapat link bertuliskan "Bookmark this, Bookmark this site, dll". Fungsi dari link itu adalah untuk mememerintahkan browser kita untuk menyimpan alamat blog atau situs tersebut di daftar bookmark browser kita itu. Sebagai contoh, coba anda klik link di bagian kanan atas blog saya ini yang bertuliskan Bookmark Blog Ini. Gimana hasilnya? Ada tampilan pop-up yang yang berfungsi untuk menyimpan bookmark baru kan?

Keuntungan dari script ini adalah untuk memudahkan pengunjung untuk mengakses blog kita secara cepat dan bisa selalu mengingatnya, jadi kita bisa mempertahankan kunjngannnya itu untul seterusnya. Ok, daripada memperpanjang muqodimah, mari kta langsung aja masuk ke judul ceramah kali ini, eh cara untuk membuat script bookmark site ini, hehehe...

Berikut Cara Membuat Script Bookmark Site

1. Login ke akun Blogger anda

2. Pilih Layout > Edit HTML

3. Cari kode </head>, lalu paste kode javascript berikut di atasnya:

<script type='text/javascript'>
function bookmarksite(title,url){
if (window.sidebar)
window.sidebar.addPanel(title, url, "");
else if(window.opera && window.print){
var elem = document.createElement('a');
elem.setAttribute('href',url);
elem.setAttribute('title',title);
elem.setAttribute('rel','sidebar');
elem.click();
}
else if(document.all)
window.external.AddFavorite(url, title);
}
</script>

4. Klik Save Template

5. Untuk menampilkan linknya bisa anda buat dengan text link biasa atau dengan gambar, kodenya:
Text link biasa:

<a href="javascript:bookmarksite('Judul Blog', 'URL Blog')">Bookmark Blog Ini!</a>

Link dengan gambar:

<a href="javascript:bookmarksite('Judul Blog', 'URL Blog')"><img src="url-gambar-anda" border="0"/></a>

Note:
Jika judul blog anda terdapat tanda kutip misalnya Zacky's Blog, maka anda harus menambahkan sebuah backslashed di javascript link anda, sehingga menjadi:

<a href="javascript:bookmarksite('Zacky\'s Blog', 'URL Blog')">Bookmark Blog Ini!</a>

Link tersebut bisa anda letakkan di tempat yang anda inginkan.

Gimana? Mudahkan?
Oya, jangan lupa bookmark blog saya ini dan visit blog baru IndoGals ya.. Makasi...

Selamat mencoba...

Turnout Mag Blogger Magazine Template

2010-02-22T16:24:00.007+07:00

Demo | Download
- Automatic Readmore + Thumbnails
- Two main columns on the Homepage (Magazine style)
- Banner ad / Adsense ready
- 468 x 60 px Banner ad on the header
- Three Columns
- Search Box
- SEO Optimized
- Featured Video

Author: BloggerTricks.com
Instalasi: Klik disini

Falkner Press Blogger Magazine Template

2010-02-11T17:38:00.002+07:00

Demo | Download
- Automatic Readmore + Thumbnails
- Featured Content Slider
- Adsense ready
- PSD Custom Logo Included
- Youtube Video embedding Integrated
- Fully SEO Optimized
- Advertisement Block Ready
- 3 Columns
- Social Bookmarking Icons
- Twitter Updates widget
- Feedburner Email Subscription ready
- Thumbnails on Recent Posts in Sidebar
- Integrated Search box
- Beautiful top Navigation bar
- Cross-browser compatible

Author: BloggerTricks.com
Instalasi: Klik disini

Allurement Blogger Template

2010-02-10T16:35:00.000+07:00

Demo | Download

- Elegant Blogger Template
- Cocok untuk semua jenis blog
- Warna merah, background grey
- 2 kolom, sidebar kanan
- Search box ready, ikon Twitter dan RSS

Author: Blogger Template Place
Instalasi: Klik disini

credit: AllBlogtools.com

Drop Shadow Mempercantik Tampilan Gambar

2010-02-07T19:28:00.001+07:00

Drop Shadow adalah sebuah efek bayangan yang timbul pada suatu objek, bisa pada sebuah kotak, tabel, dan gambar. Coba anda perhatikan gambar yang ada pada setiap postingan blog ini. Semua gambar tersebut memiliki bayangan yang membuat tampilannya menjadi lebih menarik. Untuk membuat drop shadow bisa kita lakukan pada beberapa software photo editing seperti Adobe Photoshop. Tapi gimna jika semua postingan kita memiliki gambar yang akan diberi shadow dan jumlahnya banyak? Duh, bisa pusing jadinya... Tenang, dengan membaca tips ini sampai tuntas anda akan mengetahui cara memberi drop shadow pada gambar postingan dengan hanya menggunakan kode css yang simpel.

Berikut Cara Membuat Drop Shadow Gambar

1. Login ke akun Blogger anda, lalu pilih Layout > Edit HTML

2. Cari kode ]]></b:skin>, lalu paste kode css berikut tepat di atasnya:

.drop-shadow img {
background:url(http://i30.tinypic.com/1qsh1h.jpg) no-repeat right bottom;
padding: 5px 10px 10px 5px;
}

3. Cari kode <data:post.body/>, lalu ganti kode tersebut dengan kode berikut:

<div class='drop-shadow'><data:post.body/></div>

4. Terakhir, klik Save Template dan lihat hasilnya.

Selamat mencoba...

Jangan lupa kasih komentar ya...

Cara Mudah Membuat Tooltip Dengan Kode CSS

2010-02-07T14:13:00.001+07:00

Tooltip merupakan suatu fasilitas yang berguna untuk memberikan keterangan sesuatu yang sedang dituju oleh pembaca. Ada beberapa cara untuk membuat tooltip tersebut. Untuk permulaan, sekarang saya akan menjelaskan trik dasarnya yaitu dengan menggunakan kode CSS.

Menyiapkan Kode CSS

1. Login ke akun Blogger anda, lalu pilih Layout > Edit HTML

2. Cari kode ]]></b:skin>, lalu paste kode css berikut tepat di atasnya:

a.tip {position:relative}
a.tip span {
display:none;
padding:5px;
z-index:100;
background:#000;
color:#fff;
text-decoration:none;
width:200px; /* lebar tooltip */
height:auto;
-moz-border-radius:2px;
-webkit-border-radius:2px
}
a:hover.tip {
font-size:99%;
cursor:pointer
}
a:hover.tip span {
display:block;
position:absolute;
-moz-opacity:0.7;
opacity:0.7;
top:auto;
left:auto;
right:2px;
bottom:auto;
line-height:14px;
font-size:12px;
font-weight:normal;
}

Untuk mengatur posisi tooltip, ada bisa mengaturnya dengan memainkan kode top:auto; left:2px; right:auto; bottom:auto;.

3. Klik Save Template.

Menerapkan Tooltip di Blog

Anda bisa menggunakan tooltip ini di postingan atau di bagian lain blog anda. Kodenya:

<a class='tip' href='#'>kesini<span>Tooltip merupakan suatu fasilitas yang berguna untuk memberikan keterangan sesuatu yang sedang dituju oleh pembaca.</span></a>

Hasilnya: Kesini donk...Tooltip merupakan suatu fasilitas yang berguna untuk memberikan keterangan sesuatu yang sedang dituju oleh pembaca.

Gimana? Mudahkan?

Jangan lupa kasih komentar ya...

Membuat Icon External Link Dengan jQuery

2010-02-02T21:51:00.001+07:00

Selamat malam semuanya... Sebelum saya mulai menjelaskan tips ini, coba anda buka dulu blog ini.
Sudahkan? Nha, coba anda perhatikan link Smooth Scrolling Back-to-Top dan External Links Icon. Setelah link tersebut muncul icon . Icon tersebut menunjukkan bahwa link yang ada dibelakangnya adalah sebuah link external. Anda tentu sudah paham arti dari link external. Sekarang, saya akan menjelaskan cara membuat icon link external tersebut secara otomatis dengan sedikit sentuhan jQuery.

Berikut Cara Membuat Icon Link External

1. Login ke akun Blogger anda

2. Pilih Layout > Edit HTML

3. Cari kode </head>, lalu paste kode berikut di atasnya:

<style>
.exlicon img {
border:0;
padding:0;
margin:0
} /* kode ini bisa anda pindahkan tepat di atas kode ]]></b:skin> */
</style>

<SCRIPT src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> 

<script type='text/javascript'>
$(document).ready(function() {
$('.exlicon a').filter(function() {
return this.hostname && this.hostname !== location.hostname;
}).after(' <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9W5cqaUlakinSHYfJ7n1YtWNwgcFI-52kwIlTmO4xubpR9_2xWBL-557lHG9rcnvivr1MG0ym4w557VXfFyZR3cmSkuQnrbQnh7cKtrjrHxwlO1ufMvjk7rCPzUzFG4WF99lqGAOHJ3g/s400/icon.gif" alt="external link" />');
});
</script>

Keterangan:
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9W5cqaUlakinSHYfJ7n1YtWNwgcFI-52kwIlTmO4xubpR9_2xWBL-557lHG9rcnvivr1MG0ym4w557VXfFyZR3cmSkuQnrbQnh7cKtrjrHxwlO1ufMvjk7rCPzUzFG4WF99lqGAOHJ3g/s400/icon.gif adalah url icon.

4. Cari kode <data:post.body/>, ganti kode tersebut dengan:

<div class='exlicon'><data:post.body/></div>

5. Terakhir, klik Save Template.

Untuk demonya bisa anda lihat disini.

Selamat mencoba...

Cara Membuat Back to Top Dengan jQuery

2010-02-01T19:56:00.002+07:00

Hy semuanya... Masih ingat cara membuat tombol back to top yang telah saya posting dulu? Gimana? Apa anda sudah menggunakannya? Jika sudah atau pun belum, sekarang anda harus baca tips ini dengan baik karena cara membuat back to top kali ini menggunakan jQuery. Di trik lama, gerak back to top yang dihasilkan sangat cepat dan langsung menuju ke atas. Lain halnya dengan jika kita memberi sedikit sentuhan scipt jQuery. Gerak yang dihasilkan akan lebih perlahan dan lembut.

Berikut Cara Membuat Smoothscroll Go to Top

1. Login ke akun Blogger anda

2. Pilih Layout > Edit HTML

3. Cari kode </head>, lalu paste kode berikut di atasnya:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> 
<script type='text/javascript'>
$(function(){
$('a[href*=#top]').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
&& location.hostname == this.hostname) {
var $target = $(this.hash);
$target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');
if ($target.length) {
var targetOffset = $target.offset().top;
$('html,body').animate({scrollTop: targetOffset}, 1000);
return false;
}
}
});
});
</script>

4. Cari kode <body>, lalu masukkan atribut id='top' ke dalam tag <body>, maka hasilnya akan seperti <body id='top'>

5. Selanjutnya, cari kode </body> dan paste kode berikut di atasnya:

<div id='gotop'>
<a href='#top' title='Go to Top'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVSCXu8K9_pObOFA25Po0-e9OIoNofYZOW1LwnsLgtX8wDuEMtYeI6nxBW63nYg0PLmwndMPC2iblcqUb4FvQVXbFmmirmf-Sx2OxJMpQm-whfsMpUC3Dc5sA4nC6AsDmxHawy_sVrOjQ/s400/arrow1-blue-32.png' style='right:20px;bottom:20px;position:fixed'/>
</a>
</div>

Keterangan:
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVSCXu8K9_pObOFA25Po0-e9OIoNofYZOW1LwnsLgtX8wDuEMtYeI6nxBW63nYg0PLmwndMPC2iblcqUb4FvQVXbFmmirmf-Sx2OxJMpQm-whfsMpUC3Dc5sA4nC6AsDmxHawy_sVrOjQ/s400/arrow1-blue-32.png > url gambar
- right:20px; bottom:20px; > posisi gambar pada template adalah 20 pixel dari bawah dan kanan.

info: untuk gambar / tombolnya bisa anda download disini.

6. Terakhir, klik Save Template.

Untuk demonya bisa anda lihat disini.

Sedikit pemberitahuan, untuk kedepannya saya masih akan menyediakan tips tentang fungsi jQuery untuk Blogger. Jadi jangan lupa untuk berlangganan dengan Tips Blogger Zacky, ok?

Artikel Dicuri? Lindungi Blog Anda!

2010-01-31T01:04:00.001+07:00

Sekarang ini banyak sekali blog baru yang muncul setiap hari. Mereka berusaha untuk membuat blognya menjadi lebih bagus dan berisi banyak artikel. Namun kadang proses pembuatan artikel menjadi instant / cepat dengan mengcopy paste artikel orang lain. Sebenarnya hal itu boleh saja dilakukan karena isi artikel blog memang untuk dibagikan. Tapi yang tidak bolehnya mereka mengcopy paste semua artikel TANPA menyertakan link sumber atau memberikan atribusi kepada sang pemilik artikel. Ini disebut juga dengan plagiarisme, penjiplakan, atau pencurian artikel sederhana.
Dipostingan sebelumnya saya telah menjelaskan cara menghindari blog dari penjiplakan. Namun cara tersebut terlalu keras karena artikel mutlak tidak bisa di copy dan kita tidak bisa mengisi beberapa form yang ada diblog, seperti form shoutbox, email subscriber, dll. Wah, kalo begitu bisa2 tidak ada lagi orang yang akan berkunjung, hehehe... Maka dari itu, kita harus menggunakan cara lain yaitu dengan mendaftarkan semua artikel blog sehingga mendapatkan hak ciptanya.

Untuk cara ini, saya menyarankan anda untuk menggunakan jasa pendaftaran hak cipta yang terbaik dan gratis dan saya sendiri sudah menggunakannya, yaitu MyFreeCopyRight. Yah, untuk permulaan kita pakai yang gratisan saja dulu (blog aja masih gratisan, eh mau pakai hak cipta yang berbayar, hehehe...). Lanjut... Dengan MyFreeCopyRight, kita akan diberi sebuah id registrasi hak cipta dan bisa mendaftarkan masing2 artikel blog disertai dengan tanggal penerbitannya.
Proses registrasinya cukup mudah, yaitu:

1. Buka situs MyFreeCopyRight. Anda harus membuat akun anggota dengan memasukkan alamat email beserta password

2. Jika akun anda sudah aktif, segera login untuk mendaftarkan blog anda beserta artikelnya. Klik tombol PROTECT MY CREATION.

3. Pilih BLOG / PODCAST. Lalu masukkan url feed blog anda. Untuk alamat ini saya menyarankan anda untuk memasukkan sitemap yang telah anda submit ke Google Webmaster dan di generate oleh Blogger Sitemap Generator. Ini bertujuan supaya semua artikel anda bisa terdaftar, karena kalau menggunakan alamat feed biasa url yang akan dikirim hanya 25 url.

4. Setelah url anda terdaftar, anda akan diberikan kode html dan sebuah kode registrasi hak cipta, lalu pasang kode tersebut di blog anda.

Jika blog anda telah terdaftar lalu ada orang yang mencuri artikelnya, maka anda harus melaporkannya ke Blogger Team melalui halaman ini.

Google selalu meng-update algoritmanya untuk menemukan sumber artikel dan menghapus daftar duplikasi artikel yang telah terindex. Jadi jika artikel anda masih dicuri, berdasarkan pernyataan Blog Google Webmaster Central, blog anda akan tetap berada di atas blog duplikasi dalam hasil pencarian Google.

Terakhir, jika para pencuri tidak mengacuhkan hak cipta blog anda dan terus mencuri artikel, maka buatlah Daftar PENCURI ARTIKEL dan tampilkan di blog anda supaya pengunjung tahu bahwa anda adalah sang pemilik artikel yang sebenarnya dan pencuri tersebut akan merasa malu (itu pun kalau mereka masih punya rasa malu, hehehe...)

Ok, sekian dulu tips dari saya. Mudah2an berguna bagi kita semua dan mari sama2 kita BASMI PEMBAJAKAN!

Salam Blogger!

Hidden Chatbox

2010-01-28T16:23:00.003+07:00

Hidden Chatbox adalah sebuah tempat menyimpan atau meletakkan widget chatbox (Shoutmix, Shoutbox, dll) yang bisa bersembunyi. Sembunyi disini pastinya bukan berarti hilang, kabur, atau lari dari kejaran polisi (emangnya Nooordin M. Top apa?!), tapi sengaja kita sembunyikan untuk menghemat ruang blog. Sudah hampir sebulan saya tidak memasang widget shoutmix, itu karena banyak widget lain yang lebih penting darinya untuk ditampilkan. Tapi setelah belajar dan paham, saya menggunakan trik Hidden Chatbox ini untuk memasang shoutmix sehingga blog saya tidak terlihat sesak lagi(walau sebenarnya masih sesak banget, hehehehe....). Anda juga mau memasang shoutmix dengan trik ini? Baca baik-baik ya...

Trik Hidden Chatbox ini terbagi menjadi 2 pilihan, yaitu LEFT-Hidden Chatbox dan RIGHT-Hidden Chatbox. Kalau yang saya pakai di blog ini adalah RIGHT-Hidden Chatbox. Berikut kodenya:

LEFT-Hidden Chatbox

<style>
#hcl {
position:fixed;
top:100px;
left:0px;
z-index:+1000;
}
* html #hcl {position:relative;}
.hcltab {
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfMykFl80i7Rb2JvtnqG4UXip901llgjju6CrQyrLcJa1K0zZyNUMqxQAKoKQrkvwntB-qhXqlLO4hh7jprSepHZeWOwOw6szElAbJDuIv89L4q7wXzYAEz8Dp_pVcw5wHo8DMxntYhG0/s400/cbred-LEFT.png') no-repeat;
}
.hclcontent {
float:left;
border:2px solid #790909;
background:#f3f6f7;
padding:10px;
}
.hc-credit {font-size:9px}
.hc-credit a {text-decoration:none}
</style>
<script type="text/javascript">
function showHidehcl(){
var hcl = document.getElementById("hcl");
var w = hcl.offsetWidth;
hcl.opened ? movehcl(0, 30-w) : movehcl(20-w, 0);
hcl.opened = !hcl.opened;
}
function movehcl(x0, xf){
var hcl = document.getElementById("hcl");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
hcl.style.left = x.toString() + "px";
if(x0!=xf){setTimeout("movehcl("+x+", "+xf+")", 10);}
}
</script>
<div id="hcl">
<div class="hclcontent">



<br />
<div class="hc-credit">
<span style="float:left">

<a href="http://tipsbloggerzacky.blogspot.com/2010/01/hidden-chatbox.html" target="_blank">
Get this widget!
</a>
</span>
<span style="float:right">
<a href="javascript:showHidehcl()">
[close]
</a>
</span>
</div>
</div>
<div class="hcltab" onclick="showHidehcl()"> </div>

</div>
<script type="text/javascript">
var hcl = document.getElementById("hcl");
hcl.style.left = (30-hcl.offsetWidth).toString() + "px";
</script>

RIGHT-Hidden Chatbox

<style>
#hcr {
position:fixed;
top:100px;
z-index:+1000;
}
* html #hcr {position:relative;}
.hcrtab {
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMr1WaIdC_59AwhvbAgVwwoZ6J5kdPU7_9L89TNNXpBPowzEOwj_yCcMsy4SCDe-_8qxnpL1EGy1k5MRlkL16NkChP9jDBuPOpDpwX_l6LXtSW4d0MLFlWhr32ZcGqvnxuRQPqDWmfgjI/s400/cbblue.png') no-repeat;
}
.hcrcontent {
float:left;
border:2px solid #003e82;
background:#f3f6f7;
padding:10px;
}
.hc-credit {font-size:9px}
.hc-credit a {text-decoration:none}
</style>
<script type="text/javascript">
function showHidehcr(){
var hcr = document.getElementById("hcr");
var w = hcr.offsetWidth;
hcr.opened ? movehcr(0, 30-w) : movehcr(20-w, 0);
hcr.opened = !hcr.opened;
}
function movehcr(x0, xf){
var hcr = document.getElementById("hcr");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
hcr.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("movehcr("+x+", "+xf+")", 10);}
}
</script>
<div id="hcr">
<div class="hcrtab" onclick="showHidehcr()"> </div>
<div class="hcrcontent">



<br />
<div class="hc-credit">
<span style="float:left">

<a href="http://tipsbloggerzacky.blogspot.com/2010/01/hidden-chatbox.html" target="_blank">
Get this widget!
</a>
</span>
<span style="float:right">
<a href="javascript:showHidehcr()">
[close]
</a>
</span>
</div>
</div>
</div>
<script type="text/javascript">
var hcr = document.getElementById("hcr");
hcr.style.right = (30-hcr.offsetWidth).toString() + "px";
</script>

Keterangan:

#hcr {
position:fixed;
top:100px; /* Menunjukkan bahwa jarak tab dari atas adalah sejauh 100px. Bisa anda ganti dengan bottom:100px yang berarti jarak tab dari bawah menjadi sejauh 100px */
z-index:+1000;
}

.hcrtab {
height:100px; /* tinggi tab pembuka hidden chatbox */
width:30px; /* tinggi tab pembuka hidden chatbox */
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMr1WaIdC_59AwhvbAgVwwoZ6J5kdPU7_9L89TNNXpBPowzEOwj_yCcMsy4SCDe-_8qxnpL1EGy1k5MRlkL16NkChP9jDBuPOpDpwX_l6LXtSW4d0MLFlWhr32ZcGqvnxuRQPqDWmfgjI/s400/cbblue.png') no-repeat; /* gambar yang dijadikan sebagai tab pembuka hidden chatbox */
}

.hcrcontent {
float:left;
border:2px solid #003e82; /* warna dan ukuran border hidden chatbox */
background:#f3f6f7; /* warna background hidden chatbox (tidak perlu diganti jika anda mengedit kode lain pada style) */
padding:10px;
}

Berikut beberapa gambar tab pembuka hidden chatbox dan kode warna html untuk border yang serasi:

Kode warna border: #790909

Kode warna border: #aca500

Kode warna border: #008232

Kode warna border: #003e82

Kode warna border: #0079a0

Nha, sekarang kit pasang kode itu di blog. Udah tahu caranya kan? Itu, pilih Layout > Page Elements > HTML/Javascript, lalu masukkan kode Hidden Chatbox disana.

Klik disini untuk melihat demo LEFT-Hidden Chatbox dan RIGHT-Hidden Chatbox.

Note: Trik hidden ini bisa juga anda gunakan untuk memasang widget lain, jadi trik ini tidak khusus untuk memasang shoutmix. Anda tinggal berkreasi dengan kode-kode yang bisa bikin kepala jadi botak itu, hahahahahaha...!

Selamat mencoba....

Memperkenalkan TBZ-Bookmarking Widget

2010-01-27T15:11:00.002+07:00

Selamat siang semuanya... Apa kabar? Mudah2an baik semuanya ya... Kali ini saya mau bagi tips tentang social bookmarking widget. Postingan ini saya buat untuk menjawab pertanyaan saudara My Self di pada komentar postingan cara membuat buku tamu shoutbox. Widget ini saya beri nama TBZ-Bookmarking. Dengan TBZ-Bookmarking kita bisa membagikan artikel ke 12 social bookmarking situs, yaitu Facebook, Google Bookmarks, Delicious, Digg, Stumbleupon, Twitter, Technorati, Linkedin, Mixx, Newsvine, Yahoo, dan Reddit. Satu lagi, widget ini mempunyai satu kelebihan yaitu jika kita mengarahkan mouse ke gambar (hover effect), maka akan keluar title dari gambar situs yang kita tuju. Gimana? Mau pasang widget ini?

Berikut Cara Memasang Widget TBZ-Bookmarking

1. Login ke akun Blogger anda

2. Plih Layout > Edit HTML, lalu centang Expand Widget Template

3. Cari kode </head>, lalu paste kode berikut di atasnya:

<style>
.tbzbookmark {
background:#FFF !important;
width:310px; /* lebar kotak */
text-align:center;
text-transform:none;
border:1px solid #DDD; /* warna border kotak */
-moz-border-radius:5px;
padding:10px;
}
.tbzbookmark img {
margin-top:5px;
opacity:.4;
-moz-opacity:.4;
filter:alpha(opacity=40);
}
.tbzbookmark img:hover {
opacity:1;
-moz-opacity:1;
filter:alpha(opacity=100);
}
.sharemessage {
color:#666; /* warna judul */
font:Arial, Helvetica, sans-serif;
font-size:13px; /* ukuran huruf judul */
font-weight:bold;
margin-bottom:5px;
padding-bottom:2px;
border-bottom: 1px solid #CCC; /* warna border bawah judul */
}
.tbzcredit {
font-size:9px;
text-align:right;
}
.tbzcredit a {
text-decoration:none;
}
.tbzcredit a:hover {
text-decoration:underline;
}
</style>
<script src='http://z-sbookmark.googlecode.com/files/Z-Bookmarking.js' type='text/javascript'/>

4. Selanjunya, cari kode <div class='post-footer'> atau <p class='post-footer-line post-footer-line-1'>. Kalau sudah, paste kode berikut di atasnya:

<div class="tbzbookmark">
<div class="sharemessage">
<div expr:id='"sbtxt"+data:post.id'>Share this post!</div>
<script type='text/javascript'>showsbtext("sbtxt" + "<data:post.id/>",0)</script>
</div>

<div id='row1'>
<a expr:href='"http://www.facebook.com/share.php?u="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",1);"' rel='nofollow' target='_blank' title='Facebook'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYUqiMXJLt2oiqDbrX-ORnvivOuPVsDtXhY3_CEJxidxbo01EIC8I31RVrDo1Ho8PU9oKdFcoiVs-FN5UZSefZ9fiSlPPMCw0Hu-yXhM2QLk_9fHVX1-Jj2KhzvpikCUYnwR4BRmxMIus/s400/facebook.png'/></a>

<a expr:href='"http://del.icio.us/post?url="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",2);"' rel='nofollow' target='_blank' title='Delicious'><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbwpdQEA3tsIRD9w4gqafwAslMTFtBkRBl22zUqM-6tpoUPNciVDLT2UfwkTHUOL-nk3lsFzJw-NFkjAUkStgJvvf4AHoOGhVL1V5rA5fy7s-Fq9D4n8ALvPkOvxlHi7BrqF12A7SwdCE/s400/Delicious.png'/></a>

<a expr:href='"http://digg.com/submit?phase=2&url="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",3);"' rel='nofollow' target='_blank' title='Digg!'><img alt='Digg!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM4KpXqbOunvZwPiMJ7viE3zTc1zD8knbFrXdq0tXOojD73K4NZv4qlsI2EpoM9DVEPVTdvbG2EwDOjj3PGhbbnV1styyoZsvpOga2DKDydAxxiuTXWuyTjso-wPDQ2OnU7aBNF9w16ss/s400/Digg.png'/></a>

<a expr:href='"http://twitter.com/home?status=Currently reading: " + data:blog.title + " - " + data:post.url + ". What about you?"' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",4);"' rel='nofollow' target='_blank' title='Twitter'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy-WFNJ5lx3Q4L3ahGPs0XKFzAjJLskwaZd5vIzc_4EJijHCPuKWP8vbZNaWZj6JETnq7zTrYmU-tF6uIdfM9VbCtUEeL_kCDXS666QTfKkrWaxWv-UzoI0owIS9vtfQTVhONDJJLCcYM/s400/Twitter.png'/></a>

<a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",5);"' rel='nofollow' target='_blank' title='Linkedin'><img alt='Linkedin' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvWq_L3UffNu7gsXa_lTp6jIXvb_CLHn-Ur5y6Y3jqT2WOi6UuGrBTs-8NuRjSxL9XRFtg0IT_LppyWwRiNihCV2-RbFcP9Fi73RleeaA4LiCtf-CLv0vHVPyWmyYhIbnK6DgN0TIjoLM/s400/Linkedin.png'/></a>

<a expr:href='"http://www.stumbleupon.com/submit?url="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",6);"' rel='nofollow' target='_blank' title='StumbleUpon'><img alt='StumbleUpon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcuH34ymCbnWbTEpjZof9kX59SfmPph-ZiQtcgQbHLV_oRHWCGtRE_m_RHbhyci1w0HwQD7o5bqlpIOQPKseHqugzTA90HsmVaqFmJ4nXpFKX3hMHKzsCqz9FJdJGodKfVU9_RD3LDNys/s400/Stumbleupon.png'/></a>
</div>

<div id='row2'>
<a expr:href='"http://technorati.com/faves?add="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",7);"' rel='nofollow' target='_blank' title='Technorati'><img alt='Technorati' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW_s-uXaKcnt-TB5mpbKRXqD32qb1j-XPuotlQeQNh9lAPFIZ7EraN9drgY4cgcvdoM37fq5dR9I7H3J3w4OwuuICXxt1S3IP6VbOZ2nxxK2j2VGe3saIhi7VvxsTTgtFv8a_OibdGmHE/s400/Technorati.png'/></a>

<a expr:href='"http://www.google.com/bookmarks/mark?op=add&bkmk="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",8);"' rel='nofollow' target='_blank' title='Google Bookmarks'><img alt='Google Bookmarks' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSz9MpgBdAbTFDeUkLLrlXoxThZ1eHc4_Yywdu5vc3Sa3Equro5l4PLS-3TRndryT1qiUXofhqPUdK5oYOs329u3lXDljUAkMy3AnhmuDsPWyngWIS9XFN_EJUVp2coWzGkUyzIIymvXw/s400/Google.png'/></a>

<a expr:href='"http://www.mixx.com/submit?page_url=" + data:post.url' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",9);"' rel='nofollow' target='_blank' title='Mixx'><img alt='Mixx' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYv3rnLMVO7RoMPejLxPZk2ScNBt-sOj8tFBc3SDjj416JyZplC3LYPAYrR5iCQFUw1X0L4-mhi_iJ1Db7LDEod9QbnXoVNqDE9YoGZReAoUI4Y_4vWfk7FMjSbG8h9U4jfVdO5W5xIyk/s400/mixx.png'/></a>

<a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" + data:post.url + "&=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",10);"' target='_blank' title='Yahoo!'><img alt='Yahoo!' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuIi-7qL4seLZIegPBrhc6g4yy_m9mY37bBnqvwS2zCIs57YXLGmG9dcnxNA7bIUz_w_EEfvZ2-FeksjeDx57yrooM6QfCM5Os5l_NOqNQLAhKStBJCHzrRxagKU4h7s2Kc0araBEreEQ/s400/Yahoo.png'/></a>

<a expr:href='"http://www.newsvine.com/_tools/seed&save?u="+ data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",11);"' rel='nofollow' target='_blank' title='Newsvine'><img alt='Newsvine' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG1YdQRKnubNQ6XVNu4OiqGKbD5u4ZU-YjA7f2jfiq9QRhwE4u8EzFKOlvrdT6cMIe1pgU-BSRyVpALDmgqCnuMYXQXQQbUbQzFBnLA-pzdabW5avA1PH17Fc_oOBl87cL-tW-3NmnUUk/s400/newsvine.png'/></a>

<a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",12);"' target='_blank' title='Reddit'><img alt='Reddit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-S5PrOfVKjl4WKTDNe4KxLZ6zviUc721GslXAShgz6D4UwPRE_4KbhzSftvErHsYg79K7rvLdvOj8HC0prQLNvFwIGQpbj5YHkbB3VFZQtorMZN5fhCv6EYZa01q6UD5-8YDdG7-awWU/s400/Reddit.png'/></a>
</div><div class="tbzcredit"><a href="http://tipsbloggerzacky.blogspot.com/2010/01/memperkenalkan-tbz-bookmarking-widget.html" target="_blank">Get this widget!</a></div>
</div>

Untuk yang ada read more, anda tinggal masukkan kode di atas ke dalam kode berikut:

<b:if cond='data:blog.pageType == "item"'>

</b:if>

5. Terakhir, klik Save Template.

note: Tolong jangan hapus credit yang ada dibawah widget.

Untuk demonya bisa anda lihat di bawah postingan ini.

Selamat mencoba...

Mengganti Tulisan Older Post, Newer Post, Home

2010-01-24T23:42:00.001+07:00

Tulisan older post, newer post, dan home merupakan navigasi yang muncul di bawah postingan untuk beranjak ke postingan yang baru, lama, dan kembali ke homepage blog. Nha, apa pernah terpikir oleh anda untuk menggantinya dengan sebuah gambar? Saya rasa anda harus melalukannya supaya blog terlihat lebih sempurna dan berbeda dengan blog lainnya. Mau tau cara?

Berikut Cara Mengganti Navigasi Blog Dengan Gambar:

1. Login ke akun Blogger anda

2. Plih Layout > Edit HTML, lalu centang Expand Widget Template

3. Cari kode berikut:

- <data:newerPageTitle/> ganti dengan <img src="URL-GAMBAR-PREVIOUS" border="0" />
- <data:olderPageTitle/> ganti dengan <img src="URL-GAMBAR-NEXT" border="0" />
- <data:homeMsg/> ganti dengan <img src="URL-GAMBAR-HOME" border="0" />

Klik disini dan disini untuk men-download gambar / tombol Previous, Next dan Home. Password: TBZ-MBT

5. Terakhir, klik Save Template.

Jangan lupa kasih komentar dan ucapkan terima kasih kepada Mohammad Mustafa Ahmedzai ya...

Tips Meningkatkan Alexa Traffic Rank

2010-01-24T04:22:00.001+07:00

Selamat malam semuanya... Sesuai janji saya pada postingan tentang Alexa Traffic Rank, sekarang saya akan menjelaskan tips untuk meningkatkan Peringkat Alexa tersebut. Dibaca baik2 ya...

Berikut Cara Meningkatkan Alexa Traffic Rank:

1. Pasang Alexa Toolbar
Jika anda membuka blog anda setiap hari dan telah memasang Alexa Toolbar, minta teman anda untuk melakukan hal yang sama. Setiap kali kita mengunjungi blog, Alexa Toolbar akan menghubungkan kunjungan tersebut ke Alexa Ranking Engine yang akan meng-update ranking blog anda. Intinya, Alexa mengandalkan toolbar nya untuk menetapkan ranking sebuah blog atau situs.
Klik disini atau disini untuk memasang Alexa Toolbar.

2. Pasang Widget Alexa Rank
Banyak orang yang melakukan ini (termasuk saya), dan hasilnya terbukti Alexa Traffic Rank meningkat. Tampilan widget ini tersedia dalam 2 pilihan, yaitu:

Klik disini untuk mendapatkan widget Alexa Rank.

3. Tulis artikel Tentang Alexa
Anda bisa menulis berbagai hal tentang Alexa di postingan dan ajak para pembaca untuk men-download Alexa Toolbar.

4. Jadikan Blog Anda sebagai Homepage Browser
Lakukan ini pada setiap komputer yang bisa anda kontrol atau minta lah teman2 anda untuk menjadikan blog anda sebagai homepage browser mereka. Dengan begitu, setiap kali anda atau mereka membuka browser tersebut, maka blog anda akan menjadi halaman pertama yang akan muncul. Sudah tahu kan cara melakukannya? Kalau belum, begini caranya:

- Untuk Mozilla Firefox
> Buka Mozilla Firefox anda
> Pilih menu Tools > Option

> Klik tab Main, ilhat tulisan when Firefox starts. Pilih Show my home page yang ada pada dropdown menu disampingnya.
> Sudah kan? Sekarang lihat tulisan Home Page. Isi kotak yang ada disebelahnya dengan url blog anda. Misalnya http://tipsbloggerzacky.blogspot.com

> Terakhir, klik OK untuk menyimpan setting.

- Untuk Internet Explorer
> Buka Internet Explorer anda
> Pilih menu Tools > Internet Options

> Klik tab General. Isi kotak Home page dengan url blog anda. Misalnya http://tipsbloggerzacky.blogspot.com

> Terakhir, klik OK untuk menyimpan setting.

5. Tambahkan Kategori Webmaster ke Blog
Karena pada semua webmaster sudah terpasang Alexa Toolbar, ketika mereka mengunjungi blog anda, maka kunjungan tersebut akan dihubungkan ke Alexa. Cara ini akan sangat mempengaruhi Alexa Traffic Rank.

6. Tingkatkan Traffic Blog Secara Umum
Ini adalah hal pokok tentang Alexa. Semakin banyak kunjungan dan pageviews blog maka Alexa Rank akan meningkat.

Ok, sekian dulu dari saya. Jika ada kekurangan, mohon segera dikoreksi.

Salam Blogger!

Download AntiVirus PCMAV 2.2c

2010-01-24T02:43:00.000+07:00

PCMAV 2.2c Update Build1 telah hadir dengan penambahan 20 pengenal varian virus baru. Bagi Anda pengguna PCMAV 2.2c, sangat disarankan segera melakukan update, agar PCMAV Anda dapat mengenali dan membasmi virus lebih banyak lagi.

Untuk mendapatkan dan menggunakan update PCMAV ini, Anda cukup menjalankan PCMAV Cleaner (PCMAV-CLN.exe), komputer harus dalam keadaan aktif terhubung ke Internet (non-proxy). Fitur Automatic Updates dari PCMAV akan secara otomatis men-download dan meng-update database dari PCMAV.

Virus terbaru: Zhola. Dibuat dengan bahasa pemrograman Visual Basic tanpa di-pack, berukuran sekitar 672 KB, virus Zhola termasuk virus yang memiliki payload ganas. Icon yang dimilikinya menyerupai icon software lokal. Ia akan mencari berbagai file dokumen dan multimedia, untuk kemudian menghapusnya dan menggantikan dengan file virus yang menyamar dengan nama file tersebut.

Di dalam tubuhnya, virus menyimpan ekstensi file berikut: *.doc,*.jpg,*.mp3,*.avi,*.mpeg,*.3gp,*.flv,*.mpg,*.mov,*.wmv,*.wav,*.3gp2. Setiap file dengan ekstensi tersebut akan menjadi incaran virus. Selain itu pada setiap root drive yang ditemuinya, virus juga menciptakan file dengan nama windows.exe, Love Letter 4 Zhola.exe, dan autorun.inf seperti tampak pada screenshot.

Daftar tambahan virus hingga PCMAV 2.2c Update Build1:
Albim
Avt-Net
Avt-Net.dll
CintaKampus
Cuakep.G
Gambar
Gambar.bat.A
Gambar.bat.B
Geografi.B
Msa
Mshearts.htm
Mshearts.inf
Mshearts.vbs
Random8
Serviks
Serviks.inf
Serviks.vbs
Shuriken.J
Zhola
Zhola.inf

Download PCMAV 2.2b | Download PCMAV 2.2c Update Build1

Letakkan file hasil download tersebut (update.vdb) ke dalam folder \vdb. Jika sebelumnya telah terdapat file update yang lama, Anda cukup menimpanya. Pastikan sekali lagi, bahwa nama file update adalah update.vdb, jika berbeda, cukup ubah namanya. Dan nanti saat Anda kembali menjalankan PCMAV, ia sudah dalam keadaan kondisi ter-update.

Sumber: PCMAV.biz

Tingkatkan Backlink Dengan Link Referral

2010-01-22T00:23:00.001+07:00

LinkReferral.com adalah sebuah situs yang menyediakan free immediate traffic untuk blog atau situs anggotanya. Keanggotaannya bias kita dapatkan secara gratis dan berbayar. Jika kita memiliki akun berbayar, maka kita akan diberi fitur yang lebih banyak daripada akun gratis. Ya, bagi kita sang Blogger tak beruang, kita buat yang gratisnya saja dulu, ya nggak?

Cara Mendaftar ke LinkReferral.com

1.Buka situs LinkReferral.com, lalu klik tulisan join now yang ada dibawah form login
2.Isi semua data yang diperlukan di form registrasinya, dan pilih tipe akun anda (Basic Membership atau Premium Membership). Lalu klik tulisan register yang ada di bagian paling bawah halaman
3.Cek email anda untuk mengkonfirmasi akun yang telah anda daftarkan tadi
4.Setelah proses registrasi selesai, anda akan diberi referral link dan beberapa banner untuk promosi referral link tesebut.
5.Setelah memilih, klik LOGIN TO GET IMMEDIATE FREE TRAFFIC... yang ada di bagian paling bawah halaman untuk login ke akun yang baru saja anda buat.

Bagaimana Cara Mendapatkan Traffic Dari LinkReferral.com

Kapasitas traffic yang akan diberikan oleh LinkReferral.com tergantung pada kriteria rangking akun kita. Untuk mendapatkan rangking, kita harus melakukan tahap-tahap berikut:

1.Login Setiap Hari
Maka ranking di member directory traffic akan tetap berada diatas daftar anggota yang lain

2.Kunjungi Situs
Kita harus mengunjungi situs yang ada pada Directory Traffic.Selain akan diberi kunjungan balik oleh anggota yang telah dikunjungi, kita juga akan dikunjungi langsung oleh pihak LinkReferral.com. Maksimal 30 situs.

3.Review Situs
Review dilakukan untuk memberi penilaian dan tanggapan terhadap sebuah situs yang telah dikunjungi. Dengan bergitu, situs yang kita review akan me-review balik situs kita sehingga kita mendapatkan nilai yang bisa meningkatkan traffic. Maksimal 5 review.

4.Posting Sebuah Artikel / Komentar di Forum
Buka Forum list, lalu posting artikel atau sebuah komentar. Maksimal 1 artikel atau 1 komentar.

5.Pilih Situs Favorit
Pilih salah satu situs yang telah anda kunjungi untuk dijadikan situs favorit. Maksimal 1 situs favorit.

5 cara di atas harus anda lakukan setiap harinya supaya ranking anda terus meningkat, dan saya sudah merasakan hasilnya, sangat memuaskan.

Ok, sekian dulu salah satu tips meningkatkan traffic dari saya. Jika ada kekurangan, mohon segera dikoreksi.

Selamat mencoba....

Cara Membuat Widget Top Artikel / Popular Posts

2010-01-17T23:08:00.003+07:00

Widget Top Artikel atau Popular Posts adalah widget yang berfungsi untuk menampilkan daftar artikel yang paling banyak dikomentari oleh pengunjung. Cara membuatnya hampir sama mudahnya dengan cara membuat widget top komentator yang telah saya jelaskan sebelumnya. Mau?

Berikut Cara Membuat Widget Top Artikel:

1. Login ke akun Blogger anda

2. Plih Layout > Edit HTML

3. Tambahkan Page Elements dengan HTML/Javascript, lalu paste kode berikut ke dalam kotak content:

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=1a1c6e4e6d4f148e3650fda46910e15f&url=http%3A%2F%2Ftipsbloggerzacky.blogspot.com&num=10" type="text/javascript"></script><span style="font-size:9px;"><a href="http://tipsbloggerzacky.blogspot.com">Get this widget!</a></span>

*Keterangan:
- Ganti tipsbloggerzacky.blogspot.com dengan alamat blog anda tanpa http://
- Angka 10 menunjukkan jumlah artikel yang tampil pada daftar.

4. Terakhir, klik Save.

Jangan lupa kasih komentar ya...

Cara Membuat Widget Top Komentator

2010-01-15T00:34:00.001+07:00

Widget Top Komentator akan sangat berguna mereka anda yang memiliki blog dengan pengunjung yang cukup ramai. Hal ini merupakan salah satu cara untuk berterima kasih dan menunjukkan kepada mereka bahwa blog anda adalah blog yang dofollow. Cara memasang widget ini cukup mudah, anda hanya perlu menambahkan sedikit javascript ke elemen template anda. Mau?

Berikut Cara Membuat Widget Top Komentator:

1. Login ke akun Blogger anda

2. Plih Layout > Edit HTML

3. Tambahkan Page Elements dengan HTML/Javascript, lalu paste kode berikut ke dalam kotak content:

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol>');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
if(obj.value.items[i].link == "")
var item ="<li>" + obj.value.items[i].title + "</li>";
else
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=7b5e76fd684f11e94320abd4e00fbbca&url=http%3A%2F%2Ftips-blogger-zacky.blogspot.com&num=10&filter=Zacky Adrishayuni" type="text/javascript"></script><span style="font-size:9px;"><a href="http://tips-blogger-zacky.blogspot.com">Get this widget!</a></span>

*Keterangan:
- Ganti tips-blogger-zacky.blogspot.com dengan alamat blog anda tanpa http://
- Ganti Zacky Adrishayuni dengan nama anda. Ini berfungsi untuk menghapus nama anda sendiri dari daftar top komentator. Kenapa harus dihapus? Jawabannya bisa anda pikirkan sendiri... Hehehe...
- Angka 10 menunjukkan jumlah komentator yang tampil pada daftar.

4. Terakhir, klik Save.

Jangan lupa kasih komentar ya...

New! HTML Color Codes Generator

2010-01-07T20:08:00.001+07:00

Sudah baca tentang kode warna HTML? Atau tool generatornya? Kalo belum, silahkan baca dulu disini dan disini. Kalau sudah, sekarang ada lagi tool baru yang barunnya. Kali ini tool generator tersebut berbentuk sebuah roda yang berputar. Mau?

Jangan lupa ucapkan terima kasih buat team 2createwebsite.com dan Mohammad Mustafa Ahmedzai.

Semoga bermanfaat...

Membuat Efek Gambar Samar Blur

2010-01-07T19:40:00.001+07:00

Selamat malam semuanya. Kali ini saya akan membahas sedikit tentang image effect. Sebelum kita mulai, coba anda lihat About Me yang ada di atas postingan ini. Perhatikan gambar saya. Gimana? Ganteng kan? Hehehe... Tapi bukan itu tujuan anda melihatnya. Coba perhatikan lagi gambarnya baik2... Gimana? Ada yang berbeda dari gambar biasa kan? Coba anda arahkan mouse anda ke gambar tersebut? Gimana? Ada yang beda lagi? Benar, sebelum anda mengarahkan mouse gambar tersebut terlihat samar, tapi setelah mouse diarahkan tampilan gambar menjadi full (sehingga kelihatan banget ganteng nya saya ini, hehehe...). Itulah yang dinamakan dengan efek blur. Mau tau cara membuat nya?

Berikut Cara Membuat Efek Blur:

1. Login ke akun Blogger anda

2. Plih Layout > Edit HTML, lalu centang Expand Widget Template

3. Cari kode ]]></b:skin>, lalu paste kode css berikut di atasnya:

a.linkopacity img {
filter: alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;\
}

a.linkopacity:hover img {
filter: alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0;
}

4. Klik Save Template.

Cara Menggunakannya:
Misalnya kode gambar anda seperti:

<img src="http://tipsbloggerzacky.googlecode.com/files/50000.jpg" border="0"/>

Untuk membuat efek blur, kita harus memasukkan kode gambar tersebut ke dalam tag <a> dengan class="linkopacity". Maka kode tersebut akan menjadi seperti:

<a class="linkopacity"><img src="http://tipsbloggerzacky.googlecode.com/files/50000.jpg" style="width:375px;height:184px;border:none"/></a>

Hasilnya:

Selamat mencoba...

Jangan lupa kasih komentar ya...