Recent Posts

Minggu, 23 Oktober 2011

BLOG (Merubah Tampilan Gadget Link List)


Satu lagi alternatif blogroll (tempat link teman di blog kita) setelah kemaren membahas tentang cara membuat blogroll dengan manual HTML sekarang saya akan mencoba membuat blogroll dengan gadget Blogger default yaitu link list.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLVUMXzjabwt1Ku9eHRR-fVF4VwmEqJjDo0lrbxkLnZf08L1bTlk911GVXSNcCx5TNRV9abKOMincNwVClcIhUqfNzC1vfg_mU8arsKcfLx5xWzBp-1qS3_ijqdl_9LLJ51NjI0TkBowg/s400/link-list.gif

Pada standartnya gadget ini tidak begitu sering digunakan oleh para peblogger karena jika Linknya banyak akan memenuhi halaman Blog kita dan jika linkya di klik tidak membuka jendela baru tapi malah akan membuka di jendela lama yang kita gunakan.

tapi saya ada suatu trik untu membuat gadget Link List ini menjadi sederhana dengan efek scroll dan efek pembukaan link di jendela baru.. Lihat contoh di blog saya (disini)
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYknDQealBlfmw6bKv2KFtUOkkimFQ4mreKEeoJrRvP9uDc_uF2r-lVesxeSpLl1lm2MiKxZNOXr9ZPCaKa-0CUzvP-0eiD_JgL8BL4e-QyQ7wrZa_v56lQ74vhqsGxFSmx30-sxVphMH3/s200-r/blogroll_ke_bawah.gif

Masih banyak peblogger yang tidak ingin repot membuat tempat link teman dengan gadget bawaan dari blogger yaitu "link list" secara penggunaanya mudah gitu... Oke kita langsung saja ke cara pembuatanya

Lanhkah pertama yaitu sudah Log In ke blogger dan pasti sudah memasang Gadget "Link List"

Setelah langkah pertama terlaksanakan lalu masuk menu Layout kemudian masuk menu Edit HTML dan centang "expand widget templates"

Lalu Cari Code HTML seperti dibawah ini

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

Kemudian Ganti code diatas dengan Code dibawah ini..


<div style='width:100%; height:100px; overflow:auto;'>
<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>
</div>

Perhatikan code height:100px; itu adalah tinggi dari link list bisa kamu ubah-ubah sesuai selera kamu.. jadi jika linkya melebihi batas tinggi maka akan ada efek scrollnya

Kemudian Simpan dehh.. dan lihat hasilnya..

Gimana gampang kan silahkan berexperimen. yahh

Tidak ada komentar:

Posting Komentar