Memasang Widget Yahoo Messenger

Widget Status Yahoo Messenger ini berfungsi untuk menunjukkan Status YM kita, Online apa Offline.

Bentuk Widget 1 :



Kode HTML :
<a href="ymsgr:sendIM?IdAnda">
<img border="0" src="http://opi.yahoo.com/online?u=IdAnda&amp;m=g&amp;t=2" /></a>


Bentuk Widget 2 :


Kode HTML :
<a href="ymsgr:sendIM?IdAnda"> <img src="http://opi.yahoo.com/online?u=IdAnda&amp;m=g&amp;t=6&amp;l=us"/></a>


Bentuk Widget 3 :


Kode HTML :
<a href="ymsgr:sendIM?IdAnda"> <img src="http://opi.yahoo.com/online?u=IdAnda&amp;m=g&amp;t=9&amp;l=us"/></a>


Bentuk Widget 4 :


Kode HTML :
<a href="ymsgr:sendIM?IdAnda"> <img src="http://opi.yahoo.com/online?u=IdAnda&amp;m=g&amp;t=14&amp;l=us"/></a>


Bentuk Widget 5 :


Kode HTML :
<a href="ymsgr:sendIM?IdAnda"> <img src="http://opi.yahoo.com/online?u=IdAnda&amp;m=g&amp;t=8&amp;l=us"/></a>


Bentuk Widget 6 :


Kode HTML :
<a href="ymsgr:sendIM?IdAnda"> <img src="http://opi.yahoo.com/online?u=IdAnda&amp;m=g&amp;t=11&amp;l=us"/></a>


Bentuk Widget 7 :


Kode HTML :
<a href="ymsgr:sendIM?IdAnda"> <img src="http://opi.yahoo.com/online?u=IdAnda&amp;m=g&amp;t=13&amp;l=us"/></a>

Untuk memasangnya :
Login Ke Blog Anda > Rancangan > Tambah Gadget > HTML/JavaScript
Kemudian copy-paste kan Kode HTML nya.

Memasang Widget Kurs Mata Uang

Login ke akun blogger hingga masuk Dasbor >> Rancangan >> Tambah Gadget >> Tambahkan HTML/Javascript.
Kemudian copy kode berikut ini :

<iframe border="0" frameborder="0" marginheight="0" marginwidth="0" height="250" src="http://masterbisnis.com/kurs_bca.php" scrolling="no" width="180"></iframe>

Jika menginginkan, kita dapat merubah variable “height” dan “width” dengan angka yang lebih besar atau lebih kecil tergantung selera dan kebutuhan.

Hasilnya seperti tampak pada blog ini

Widget SHOUTBOX (Buku Tamu) Untuk Blog

Buku Tamu (Shoutbox) dalam sebuah blog cukup penting karena merupakan salah satu forum komunikasi antara pemilik blog dan pengunjung serta tempat dimana para pengunjung ingin mengajukan pertanyaan ataupun komentar ke pemilik blog.
Untuk membuat dan memasang buku tamu tersebut ke blog anda silakan ikuti langkah-langkah berikut:

1. Silakan buka http://www.shoutmix.com kemudian daftar terlebih dahulu dengan cara mengklik tulisan Get One now, free, ataupun dengan meng-klik tulisan Sign Up atau Create. Silahkan anda tulis data-data anda pada form yang telah di sediakan.
Jika sudah terdaftar silahkan anda login dengan id anda
2. Pada menu Display pilih Style and Colour, silakan pilih style shoutbox yang anda inginkan kemudian save setting
3. Untuk mendapatkan kode HTML dari shoutbox anda, silahkan ke menu setting->Quick Start ->Get Code kemudian silakan Isi lebar dan tinggi shoutbox yang di inginkan
4. Copy seluruh kode HTML yang ada pada text area yang berada di bawah tulisan Generated Codes, lalu simpan di program Notepad anda
5.Klik Log out yang berada di atas layar anda untuk keluar dari halaman shoutmix anda.
6.Selesai

Untuk memasangnya di Blog :
Login Ke Blog Anda > Rancangan > Tambah Gadget > HTML/JavaScript
Kemudian copy-paste kan Kode HTML nya.

Contoh silahkan KLIK DISINI

Widget Jam DIGITAL Untuk Blog

Caranya adalah :
Login Ke Blog Anda > Rancangan > Tambah Gadget > HTML/JavaScript
Kemudian copy-paste kan Kode HTML nya.

Digital 1 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="5001-blue.swf";obj.TimeZone="JOG";obj.width=300;obj.height=25;obj.Place="";obj.DateFormat="DD-mm-YYYY";obj.wmode="transparent";showClock(obj);</script>

Digital 2 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="5009-black.swf";obj.TimeZone="JOG";obj.width=300;obj.height=30;obj.wmode="transparent";showClock(obj);</script>

Digital 3 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="8005-gray.swf";obj.TimeZone="JOG";obj.width=150;obj.height=150;obj.wmode="transparent";showClock(obj);</script>

Analog 4 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="5010-pink.swf";obj.TimeZone="JOG";obj.width=222;obj.height=66;obj.wmode="transparent";showClock(obj);</script>

Analog 5 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="5011-monkey.swf";obj.TimeZone="JOG";obj.width=140;obj.height=120;obj.wmode="transparent";showClock(obj);</script>

Widget Jam ANALOG Di Blog

Caranya adalah :
Login Ke Blog Anda > Rancangan > Tambah Gadget > HTML/JavaScript
Kemudian copy-paste kan Kode HTML nya.

ANALOG 1 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="0021-gray.swf";obj.TimeZone="JOG";obj.width=135;obj.height=135;obj.wmode="transparent";showClock(obj);</script>

ANALOG 2 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="0023-orange.swf";obj.TimeZone="JOG";obj.width=130;obj.height=130;obj.wmode="transparent";showClock(obj);</script>

ANALOG 3 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="8004-black.swf";obj.TimeZone="JOG";obj.width=150;obj.height=150;obj.wmode="transparent";showClock(obj);</script>

ANALOG 4 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="0032-white.swf";obj.TimeZone="JOG";obj.width=130;obj.height=130;obj.wmode="transparent";showClock(obj);</script>

ANALOG 5 :

Kode HTML :
<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="0030-black.swf";obj.TimeZone="JOG";obj.width=180;obj.height=180;obj.wmode="transparent";showClock(obj);</script>

Membuat Slide Gambar Berkedip

Caranya adalah : Upload gambar yang akan dijadikan materi slide melalui http://gickr.com/ .
Setelah itu lakukan setting ukuran gambar dan kecepatan slide melalui menu yang telah tersedia di http://gickr.com/ .

Setelah anda klik menu upload maka akan mendapatkan hasilnya yang berupa embed code / HTML kode (letaknya di sebelah kiri).
Copy paste kan kode tersebut pada lembar HTML blog anda.

Contohnya bisa anda lihat pada blog ini

Membuat Banner Berjalan

Ada beberapa tahap yang harus anda lakukan :
1. Upload gambar dari komputer ke situs layanan image hosting gratis. Dalam contoh ini kita menggunakan tinypic
2. Buat kode banner di blog

Langkah detail untuk membuat :
Buka situs www.tinypic.com, kemudian Klik Browse, pilih gambar di komputer , klik Upload Now.

Anda akan mendapatkan link gambar yang sudah diupload (Gunakan link yang ada di : Direct Link For Layouts)

Dalam contoh ini kita menggunakan 3 banner dengan "Direct link for layouts" sebagai berikut:

http://i35.tinypic.com/21cfbr6.jpg
http://i35.tinypic.com/2qdv2ia.jpg
http://i33.tinypic.com/343ivjk.jpg

Maka Kode HTML untuk :

Gambar 1 buah, bergerak dari kanan ke kiri.
Anda bisa mengatur tinggi dan lebar gambar sesuai gambar yang anda upload , dalam contoh ini :
a. width="150" lebar gambar 150 sesuaikan dengan gambar anda
b. height="150" lebar gambar 150 sesuaikan dengan gambar anda

Kode HTMLnya :
<marquee behavior="scroll" direction="left" scrollamount="3" width="150" height="150"><img src="http://i35.tinypic.com/21cfbr6.jpg" />
</marquee>

Maka hasilnya :



Jika gambarnya lebih dari satu (dalam contoh ini kita gunakan 3 gambar), bergerak dari kanan ke kiri.

Kode HTMLnya :
<marquee behavior="scroll" direction="left" scrollamount="3" width="150" height="150"><img src="http://i35.tinypic.com/21cfbr6.jpg"/> <span style="padding: 5px;"> <img src="http://i35.tinypic.com/2qdv2ia.jpg"/> </span> <span style="padding: 5px;"> <img src="http://i33.tinypic.com/343ivjk.jpg"/></span></marquee>

Maka hasilnya :


Jika gambarnya bergerak secara vertikal , untuk mengubah bergerak dari atas ke bawah , ganti direction="up" menjadi direction="down".

Kode HTMLnya :
<marquee behavior="scroll" direction="up" scrollamount="3" width="150" height="150"><img src="http://i35.tinypic.com/21cfbr6.jpg"/> <br> <img src="http://i35.tinypic.com/2qdv2ia.jpg"/><br><img src="http://i33.tinypic.com/343ivjk.jpg"/><br>
</marquee>

Maka hasilnya :







Catatan : "Scrollamount" adalah kecepatan geraknya

Membuat Tulisan Berkedip-Kedip

Contoh :
SELAMAT DATANG

Kode HTML :
<blink><b>SELAMAT DATANG</b></blink>

Tulisan Bergerak Zig-Zag

Contohnya :

Zig-zag

Kode HTML :
<marquee behavior="alternate" direction="up" height="50px">
<marquee direction="right">Zig-zag</marquee>
</marquee>