Sunday, April 10, 2011

Cara Membuat Kotak Blogroll dan Efek Marque

Kotak BlogrollCara Membuat Kotak Blogroll dan Efek Marque - Membicarakan masalah efek marque dan kotak blogroll, pada posting sebelumnya saya pernah share cara membuat efek marque pada judul blog. Pada kesempatan kali ini, kita akan mempelajari cara membuat kotak blogroll dan efek marque pada blog. Apa maksudnya kotak blogroll? Kotak blogroll adalah sebuah kotak kecil yang dapat diatur ukurannya yang dalamnya berisi anchor text teman. Lalu apakah efek marque pada kotak blogroll tsb? Sama aja kok kayak kotak yang berisi anchor text namun berjalan.

Ngerti ga ya sobat semua. Kalo sobat masih belum ngerti silahkan lihat demonya disini.

Nah sudah mengerti kan? Begitulah kotak blogroll tsb. Penasaran sobat ingin membuatnya? Ikuti langkah-langkahnya berikut ini:

1. Kotak Blogroll Model Text Area


1. Login ke akun blogger sobat.
2. Pilih Rancangan, lalu klik Add a Gadget.
3. Pada window yang terbuka, pilih HTML/Javascript, lalu isikan kode berikut:
<div style="background:"white";border: 1px solid rgb(153, 153, 153); height: 100px; overflow: hidden; text-align: left; width: 200px;">
<ul>
<li><a href="url sahabat1" target="blank">title blog sahabat1</a></li>
<li><a href="url sahabat2"target="blank">title blog sahabat2</a></li>
<li><a href="url sahabat3"target="blank">title blog sahabat3</a></li>
<li><a href="url sahabat4"target="blank">title blog sahabat4</a></li>
<li><a href="url sahabat5"target="blank">title blog sahabat5</a></li>
<li><a href="url sahabat6"target="blank">title blog sahabat6</a></li>
<li><a href="url sahabat7"target="blank">title blog sahabat7</a></li>
<li><a href="url sahabat8"target="blank">title blog sahabat8</a></li>
<li><a href="url sahabat9"target="blank">title blog sahabat9</a></li>
<li><a href="url sahabat10"target="blank">title blog sahabat10</a></li>
</ul></div>
Keterangan:
- Kode width: 200px; dan height: 100px; adalah ukuran lebar dan panjang kotak, kamu bisa merubahnya dan menyesuaikanya dengan ukuran yg kamu suka.
- Ganti tulisan "url sahabat1,url sahabat2, url sahabat3 dst" dengan daftar link-link kamu, oh ya itu juga bisa diisi dengan banner link.

2. Kotak Blogroll Model Marquee


Kotak ini juga mampu menampung banyak link dalam tempat yang sempit. Namun kotak blog roll ini berbeda dengan kotak yg diatas, karena kotak yang ini tidak memiliki rollbar.  Link-link ato isi didalam kotak ini akan bergerak/berjalan, bisa vertikal ato horizontal. Nah gini nih cara buatnya:
1. Login ke akun blogger sobat.
2. Pilih Rancangan, lalu klik Add a Gadget.
3. Pada window yang terbuka, pilih HTML/Javascript, lalu isikan kode berikut:
<MARQUEE align="center" direction="up" height="100" scrollamount= "2" onmouseover='this.stop()' onmouseout='this.start()' width="95%" >

#link1 <br />
#link2 <br />
#link3 <br />
#link...<br />

</marquee>
 Keterangan :
- Kode "up" itu menunjukan arah pergerakan, kamu bisa menggantinya dengan down, left, right (Pasti udah tau artinya kan).
- Jika kamu menggantinya dengan pergerakan horizontal (left ato right) maka hilangkan kode <br />.
- Angka "100" menunjukkan tinggi dari kotak blogroll kamu. Semakin banyak angkanya maka semakin tinggi pula ukuran blogroll.

Sekian dulu artikel mengenai Cara Membuat Kotak Blogroll dan Efek Marque. Anda bisa menerapkan widget ini dan diisi dengan daftar link teman-teman anda.
Selamat Mencoba ..

0 comments:

Post a Comment