Memodifikasi Widget Link list pada Blogger

Sudah lama saya tidak update posting artikel. Nah kali ini saya akan mencoba memodifikasi widget link list. Widget ini sebenarnya cukup memudahkan kita untuk membuat daftar link blog teman atau biasa disebut blogroll.Kemudahan yang terdapat pada widget ini yaitu kita tinggal menambahkan saja URL blog teman kita beserta anchor textnya dengan mudah tanpa harus menggunakan tag html untuk membuat link. Namun ada juga kelemahan pada widget ini, yaitu ketika daftar link yang kita tambahkan sudah begitu banyak. Ketika katakanlah kita mempunyai jumlah link yang dipasang sekitar 20 lebih, maka widget ini akan memanjang ke bawah menyesuaikan jumlah link yang terdapat pada widget tersebut. Nah, saat inilah link list akan terasa menggangu pemandangan blog kita karena akan terus memanjang seiring dengan bertambahnya jumlah link blog teman kita. Tapi tenang , ada cara untuk membuatnya tetap praktis dan mungil saat nampang di sidebar meskipun menampung jumlah link yang banyak.

Kita akan membuat widget link list ini mempunyai efek text yang berjalan ke atas. Untuk hasil akhirnya bisa dilihat seperti pada widget "My Friends" di sidebar blog saya ini.

Nah langsung saja memulai modifikasinya. Tapi sebelum itu tentu harus menambahkan widget link list terlebih dulu pada blog kita.

* Buka dashboard blogger.
* Layout -> Page Elements.
* Klik "add a gadget".
* Pilih "Link List".
* Isi dengan beberapa link blog teman.
* klik save

Setelah selesai menambahkan widget, saatnya kita mulai memodifikasi. Berikut langkah-langkahnya :

1. Buka dashboard blogger.
2. Layout -> Edit HTML ( *Untuk jaga-jaga sebaiknya back up dulu template blogmu ).
3. Centang " Expand Widget Templates "
4. Cari kode di bawah ini.

<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>

5. Setelah ketemu, ganti kode di atas dengan kode di bawah ini.

<marquee align='center' direction='up' height='200' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='95%'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target' target='new'><data:link.name/></a></li>
</b:loop>
</ul>
</marquee>

Catatan :

• Kode yang berwarna merah adalah kode yang ditambahkan pada kode asli.

• Marquee adalah kode yang membuat efek teks berjalan.

• direction='up' : merupakan arah kemana efek tersebut bergerak, misal jika ganti "up" menjadi "down" maka arahnya akan menuju ke bawah. Bisa juga diganti dengan "left" atau "right".

• height='200' : adalah tinggi kotak widget. Bisa diganti sesuai selera.

• onmouseout='this.start()' onmouseover='this.stop()' : adalah events saat cursor mouse berada di atas daftar link maka efek berjalan akan berhenti namun jika kita memindahkan cursor ke tempat lain maka teks akan berjalan seperti semula.

• target='new' : digunakan untuk membuat tab baru pada browser ketika link di klik. Sehingga, pengunjung tidak meninggalkan halaman blog kamu saat mengeklik link di blogroll.

6. Jangan lupa save untuk melihat perubahannya. Selesai

Gimana mudah bukan untuk membuat blogroll ?. Dengan cara di atas kita tidak usah repot saat ingin menambahkan link baru ke dalam blogroll .
Terima kasih buat tutorial-jitu yang memberi saya inspirasi untuk posting artikel ini.