Blog Roll dengan Widget Link List

Oleh Ade Sanusi

9.26.2008

Bagikan :

Tweet

Link List: Add a collection of your favorite sites, blogs, or web pages. nah itulah sedikit penjelasan dari Mbah Blogger, Widget Link List Gunanya untuk Mempermudah kita Untuk Menambahkan Sebuah Situs Atau blog atau Link Favorit yang Sering Kita Kunjung, :) Terkadang banyak Juga yang Menggunakannya Sebagai Blogroll alias Link Teman. Namun Ada Satu Masalah Jika kita Gunakan Untuk Blog Roll,/Link Teman karena Tampilannya Akan Terus Mengurut Ke Bawah dan Semakin Banyak Linknya Semakin Tinggi, sehingga memakan banyak tempat.
Nah Kali Ini Dunia Blogger ingin Berbagi Tips Buat Teman-Teman Semua, dengan Menggunakan Widget Link List, kita bisa dengan Mudah menambahkan Link Teman dengan Cepat, Cukup Tau nama dan Alamatnya Aja, Gak Perlu Ribet Ribet buat Kode :D dan kelebihan lainya kita bisa menentukan jumlah link yang akan di tampilkan dan Bisa diurutkan Berdasarkan Abzad juga lho:D


Sebelum memulai Modifikasi, Harus Memasang dulu Widgetnya dengan Cara Klik Add Widget dan Cari deh [Link List]... Sialahkan Isi 2 atau Beberapa link teman dengan Klik [Add Link] Dan pada bagian Title saya sarankan isi dengan "Link Teman" supaya Nantinya gak Ribet :D jika sudah lanjut pada langkah Modifikasi:

Roll Pada Widget Link List (Blog Roll)

Link Ke Samping:

Di sini, Link yang di Tampilkan Ke Samping dan dari kiri, ke kanan sampai batas kanan, kemudian link pindah kebaris berikutnya. Antar Link yang Satu dan yang Lainnya di Pisahkan oleh Tanda "|"  garis lurus seperti huruf  i,

Langkah Untuk Membuat Widget Link List menjadi Blogroll Samping Caranya Cukup Simple kok:
Perhatik Kode ini:

<b:widget id='LinkList1' locked='false' title='Link Teman' type='LinkList'>
<b:includable id='main'>

<b:if cond='data:title'><h2><data:title/></h2></b:if>
 <div class='widget-content'>
   <ul>
     <b:loop values='data:links' var='link'>
       <li><a expr:href='data:link.target'><data:link.name/></a></li>
     </b:loop>
   </ul>
   <b:include name='quickedit'/>
 </div>
</b:includable>
</b:widget>

 Caranya Cukup Mudah Kok yaitu dengan Cara menghapus kode <ul> <li> </li> dan </ul> selanjutnya Pasang Pembatas menggunakan simbol yang diinginkan, misalnya |, }, +, dan lainnya letakan sebelum kode </a>   tambahkan juga  kode Roll (yang tebal warna merah) dan Ini hasil modifikasinya:

<div style='width:100%; height:100px; overflow:auto;'>
<b:loop values='data:links' var='link'>
       <a expr:href='data:link.target'><data:link.name/>||</a>
</b:loop>
 </div>

Mudah Kan? pembatasanya di sini garis lurus dua buah tuh yang ada background hijau: D

Link Ke Bawah:

Cara ini sudah ada di blog sahabat  [ANASKU] mampir Kesana yah.. :) [Roll Pada Widget label], Kalu yang ini, Lik di tampilkan per baris dan Seterusnya Ke Bawah, Agar gak Penuh Makanya di Tambahkan Kode Roll sehingga Linknya bisa di Gulung.

Kodenya Sama Seperti di Atas, Hanya menambahkan saja dan Gak ada yang perlu di Hapus :dHasil Modifikasi Kurang Lebih Seperti 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

Selesai Semua Tutorialnya dan Silahkan Pilih yang Mana, sesuai Selera Masing-Masing Jika sudah Silahkan Simpan dan Lihat Hasilnya: Untuk pengaturan lainnya bis menambahkan width, height sesuai dengan nilai yang diinginkan.  Sekarang dengan mudah kita pasang Link teman tanpa mesti buka/otak-atik kode HTML, Cukup menambahkan Link dan nama Tampilannya aja Semuanya Selsai deh....

Tag : Tips and Trik, Unik, Widget