Thursday, June 16, 2011

Tips Membuat Kotak Tukar Link Bergerak

Apabila sobat sering mengujungi suatu situs atau web pasti pernah melihat Kotak Tukar Link kan??, Tujuannya tak lain untuk mempererat hubungan persaudaraan antar blogger di dunia dan untuk ikut mempromosikan blog atau situsnya diblog yang dikunjungi dan meminta untuk tukar link. Sehingga apabila pengguna mengklik salah satu judul link maka akan di arahkan ke situs yang di klik.

Oke sekarang mari kita mulai praktekin :
  • Kotak Link Scroll
Berikut cara Membuat Link dengan Scroll (text area):

1. Buka menu Layout ( Tata Letak)
2. Page Elements ( elemen halaman)
3. Kemudian Tambah Gadget dan pilih HTML/JavaScript
4. kemudian copy peste kode HTML dibawah ini :

<div style="overflow:auto; width:80px; height:400px; padding:10px; border:1px solid #7CFC00;">

<li>kode link teman anda</li>
<li>
kode link teman anda</li>

<li>kode link teman anda</li>
<li>kode link teman anda</li>

</div>

 
Keterangan :
width 80px >> untuk lebar halaman ganti angka width sesuai lebar halaman blog anda
height400px >>untuk tinggi halaman ganti angka height sesuai tinggi halaman blog anda
Teks merah > ganti dengan banner link teman anda


  • Kotak Link Dengan Efek Marquee (Teks Bergerak)
1. Buka menu Layout ( Tata Letak)
2. Page Elements ( elemen halaman)
3. Kemudian Tambah Gadget dan pilih HTML/JavaScript
4. kemudian copy peste kode HTML dibawah ini :

<marquee direction="up" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="3" width="100%"height="300%">

<li><a href="http://linktemananda/"target="_blank">judul blog teman anda</a></li>
<li><a href="http://linktemananda/"target="_blank">judul blog teman anda</a></li>
<li><a href="http://linktemananda/"target="_blank">judul blog teman anda</a></li>
 
</marquee>


Keterangan :
marquee > Teks berjalan dalam bahasa html
direction="up" > Teks bergerak keatas (sobat dapat menggantinya sesuai selera sobat mau ke kiri,kanan,bawah, bolak-balik dll tinggal ganti kata up menjadi "bottom", "left", "Right", "alternate".
onmouseover="this.stop()" > jika mouse diarahkan maka teks tsb akan berhenti
scrollamount="3" > kecepatan gerak teks
width: 100%  >  Ukuran panjang text area tersebut
height: 300% >  Ukuran lebar text area tersebut

Hasilnya dapat anda lihat diblog saya.....
Thanks semoga artikel ini bermanfaat buat sobat-sobat bloger.. ^_^


Related Post

0 comments:

Post a Comment

Mohon tinggalkan jejak/komentar sobat disini. Dilarang SPAM. Okey...