Berikut ini tiga tipe contoh blogroll yang bisa Anda gunakan baik yang bernaung dibawah bendera blogger ataupun blog wordpress self hosted maupun dengan hosting wordpress (free). Dan widget blogroll ini hanya memerlukan tag HTML biasa dengan menggunakan semacam “kotak” kemudian diberi overflow dengan dibatasi width (lebar) dan height (tinggi) sehingga overflow pun berfungsi dengan baik jika link blog teman-teman Anda sudah begitu banyaknya. Tiga tipe tersebut adalah dengan border (garis tepi) tanpa border dan menggunakan warna background.
Untuk membuat widget kotak blogroll tersebut yang Anda perlukan adalah tag HTML sebagai berikut,
Tag HTML blogroll dengan border (Blogroll 1)
<div style="border: 1px solid rgb(153, 153, 153); overflow: auto; width: 150px; height: 200px; text-align: center; background:#FFFFF;">
<a href="http://URL-BLOG" target="_blank">Tekslink 01</a><br/>
<a href="http://URL-BLOG" target="_blank">Tekslink 02</a><br/>
Link lainnya
</div>
Tag HTML blogroll tanpa border (Blogroll 2)
<div style="border: 0px; overflow: auto; width: 150px; height: 200px; text-align: center; background:#FFFFFF;">
<a href="http://URL-BLOG" target="_blank">Tekslink 01</a><br/>
<a href="http://URL-BLOG" target="_blank">Tekslink 02</a><br/>
Link lainnya
</div>
Tag HTML blogroll dengan background (Blogroll 3)
<div style="border: 1px solid rgb(153, 153, 153); overflow: auto; width: 150px; height: 200px; text-align: left; background:#FEA8A1;">Anda bisa mengubah lebar dan tinggi kotak widget blogroll tersebut dengan mengubah angka yang terdapat setelah width (lebar) dan height (tinggi) disesuaikan dengan ukuran sidebar template Anda. Lalu untuk align teks dan backgroundnya, Anda bisa mengubah left (kiri), right (kanan) atau center (tengah) setalah text-align: dan mengubah kode warna setelah background:# … disesuaikan dengan warna template Anda. Selamat mencoba ^_^
<a href="http://URL-BLOG" target="_blank">Tekslink 01</a><br/>
<a href="http://URL-BLOG" target="_blank">Tekslink 02</a><br/>
Link lainnya
</div>
2 komentar:
Seperti ini mas, sudah saya coba. Tapi gak adaa scroollnya...Apa Templatenya perlu di edit? Css-nya apa perlu di tambah kode?
thanks....
boleh neh tukaran link...
Posting Komentar