™ ALiEnS --- ToPaN ™

Ternyata banyak juga yang bertanya mengenai blogroll yang saya gunakan karena mungkin hemat tempat. Dan mungkin karena sadar segalanya sekarang serba naik; baik BBM yang naik disusul harga kebutuhan pokok naik, juga ongkos angkutan umum yang ikut naik 30 hingga 50%, maka segalanya perlu diperhemat, termasuk pemasangan blogroll yang mesti diperhemat juga *beuh, ga nyambung* heuheu.
Saya tidak tahu harus menamai apa blogroll ini, tapi menurut keyword yang masuk dan pertanyaan yang saya terima diantaranya, cara membuat widget kotak untuk blogger, widget kotak blogroll untuk blogger, widget blogroll untuk blogger, tempat blogroll hemat, blogroll hemat tempat, kode html tempat blogroll, cara membuat blogroll hemat tempat, cara membuat widget kotak, cara membuat widget blogroll, blogroll wordpress, wp plugin blogroll, widget blogroll untuk wordpress (wp), dan sebagainya yang pasti untuk satu tujuan yaitu penghematan tempat di blog. memanfaatkan keyword prase ya om?. Bagaimanapun, widget blogroll ini memang hemat tempat.
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,

<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>

<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>

<div style="border: 1px solid rgb(153, 153, 153); overflow: auto; width: 150px; height: 200px; text-align: left; background:#FEA8A1;">
<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>

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!

Saat ini saya akan membahas bagaimana cara membuat gambar melayang di blog. gambar melayang adalah gambar yang letaknya selalu tetap dan tidak terpengaruh scrool mouse. Apakah sobat tertarik membuatnya ???. Sebelum membuatnya, sobat harus menyiapkan gambar. terserah sobat mau gambar bergerak yang biasanya berformat .gif atau gambar bisa yang berformat .jpeg atau bisa juga gambar foto kita...hehehe biar narsis.

Gambar yang ingin dipasang lalu di upload atau disimpan di image hosting. sobat bisa menyimpannya di photobucket.com, imageshack.com, flickr.com atau image hosting lain. Tetapi untuk gambar dengan format .gif saya biasa menyimpannya di imageshack.com. ooo...iya saya sarankan, gambar yang ingin dibuat melayang sebaiknya gambarnya jangan besar-besar karena dapat mengganggu pengunjung blog kita.

Nah untuk step-step selanjutnya akan saya tulis lebih ringkas. Setelah sobat menyimpan di image hosting, inilah yang harus sobat lakukan :


1. Login Acount blogger anda.

2. Masuk pada Pengaturan.

3. Pilih Tata letak.

4. Edit html.

5. Kemudian copy code dibawah ini dan paste di atas kode ]]> < /b:skin >

 =============================================================

#melayang {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

 =============================================================

 Ket : Kode yang tercetak kuning ( bottom dan left ) menunjukan letak gambar. Letak gambar dapat di ubah dengan mengganti kode tersebut (left=kiri, bottom=bawah, right=kanan, top=atas) sesuai dengan keinginan anda.

6. Berikutnya cari lagi di dalam template anda kode < /body >
Kemudian copy pastekan code berikut ini dan letakkan diatas kode tersebut.

  =============================================================

<div id='melayang'>
<img src='http://i478.photobucket.com/albums/rr146/tovarossi/bird_ann.gif'/></a>
</div>

  =============================================================


 Ket : kode yang berwarna kuning diganti dengan url tempat gambar anda disimpan.

7. Simpan, jadi deh........

Sebelumnya saya Minta maaf karna Script'a masih blm bisa Di Copas. 

Klo tadi saya menulis cara Tentang Tv online di Blog
naaahh klo sekarang Tentang Memasang Radio Online Mini Di Blog

Bagi sobat blogger yg ingin Memasang Radio Online Mini Di Blog
Contohnya seperti Punya saya Contohnya ada di paling bawah blog saya.
ini Script'a jika berminat memasang.

Cara'a seperti biasa login di blog sobat
Trus Tinggal menambahkan Gadget
Tambahkan HTML/Java Script.

ini kodenya Seperti ini :



Karna G bisa di kopy Silahkan Download aja javascriptnya di sini ==>  Download
======================================

 ===========================================================

Nah bagi sobat blogger yg ingin memasang Multi Tv seperti kaya di atas tuh
saya kasih Deh Scrip'a jika berminat memasang.

Cara'a seperti biasa login di blog sobat
Trus Tinggal menambahkan Gadget
Tambahkan HTML/Java Script.

ini kodenya Seperti ini :



Karna G bisa di kopy Silahkan Download aja javascript nya di sini ==>  Download
===========================================================