Wednesday, August 31, 2011

Cara Membuat Widget Blogroll

Cara membuat widget blogroll - Mungkin sudah banyak sobat yang pernah melihat widget ini, karena memang sudah banyak blogger yang memasang widget blogroll di blognya. Blogroll adalah widget yang sangat bagus untuk menghemat tempat, mungkin memang itu kali ya fungsinya ^^. Widget blogroll ini bisa diisi oleh gambar dan kalimat, dan gambar dan kalimat itu bisa diberi link. Sobat tertarik tidak membuatnya ... ? Dengan memasang widget blogroll, insya Allah blog sobat terlihat seperti blog profesional apabila diletakkan di tempat yang rapih. Yuk langsung ke TKP ... ^^

Saya hanya akan menjelaskan mengenai kode-kodenya saja, dan untuk isi dari blogroll dan cara meletakkannya Insya Allah sobat sudah pada tahu semua ... Amien ...

Scroll akan ada apabila lebar atau tinggi dari isi blogroll tersebut melebihi lebar dan tinggi blogroll yang sudah ditentukan.
Contoh :
Blogroll lebarnya 250px dan tingginya 250px. Isi (gambar / kalimat) yang dimasukkan memakan tempat seluas lebar 200px dan tinggi 500px. Barulah scroll dari blogroll akan muncul. Apabila lebar dan tinggi kurang dari 250px, scoll tidak akan muncul.

Kode dari blogroll yaitu

<div> < --- ISI --- ></div>
Simple amat ... ? Yang bener donk! Sabar dulu, itu cuma kode dasar, kalau ditambah style kodenya seperti ini

<div style=""> < --- ISI --- > </div>
Style yang bisa dimasukkan ke blogroll yaitu
- width:(ganti dengan angka)px - adalah lebar blogroll
- height:(ganti dengan angka)px - adalah tinggi blogroll
- border:(ganti dengan angka)px - adalah tebal garis pinggir blogroll
- margin:(ganti dengan angka)px - adalah jarak antara border garis lebar sidebar
- padding:(ganti dengan angka)px - adalah jarak antara border dengan isi blogroll
- line-height:(ganti dengan angka)em - adalah tinggi teks yang di dalam blogroll
- -moz-border-radius: 5px 5px 5px 5px - adalah garis lengkung pada setiap pojok blogroll
- background:#(kode warna baca disini) - adalah warna latar belakang
- text-align:(left, center, right, justify) - adalah membuat teks rata tengah, kiri, kanan
- dan masih banyak lagi

Dari style-style diatas, masukkan style diatas didalam { " } dan { " }, hasil

<div style="width:10px;height:10px"></div>
Oh iya, setelah memasukkan style-style pisahkan setiap style dengan { ; }

Sekian dulu sob posting widget scroll bar, dan ketemu lagi di lain artikel ^^ ... Masih kurang jelas / punya pertanyaan lain ... ? Silahkan berkomentar ^^

Selesai

No comments:

Post a Comment

My Ping in TotalPing.com
Feedage Grade D rated
Preview on Feedage: web-design Add to My Yahoo! Add to Google! Add to AOL! Add to MSN
Subscribe in NewsGator Online Add to Netvibes Subscribe in Pakeflakes Subscribe in Bloglines Add to Alesti RSS Reader
Add to Feedage.com Groups Add to Windows Live iPing-it Add to Feedage RSS Alerts Add To Fwicki
Ping your blog, website, or RSS feed for Free