lnjutan

Melanjutkan postingan sebelumnya bagaimana membuat blogroll marquee dalam bingkai. Caranya tinggalkan memasukkan kode blogroll marquee ke dalam kode tabel. Kode nya menjadi begini:

<table border="2" width="100" height="175" cellpadding="2"> <tr> <td align="left"> <marquee onmouseover="this.stop()" onmouseout="this.start()" width="100%" height="150" direction="up" scrollamount="3" > < a href ="http://www.ilpeng.com">Blog Ilpeng dan teknologi</a> < a href ="http://www.tutorialspss.blogspot.com">tutorialspss</a> < a href ="http://www.sandhioke.co.co">knowledge sharing</a> < a href ="http://www.sharingknowledge.co.cc">sharing knowledge</a> < a href ="http://www.sharingpengetahuan.co.cc">sharing pengetahuan</a> </marquee> </td> </tr> </table>

Tulisan warna merah ganti dengan Url link milik anda dan namanya (anchornya).
Hasilnya seperti ini:

Blog Ilpeng dan teknologi tutorialspss knowledge sharing sharing knowledge sharing pengetahuan

Blogroll Ceria
Nah kini kita memasuki ke materi utama bagaimana membuat blogroll ceria, nah apa yang saya sebut ceria adalah blogroll seperti yang saya gunakan dalam daftar isi blog ilpeng.com tapi dengan kita sisipkan gambar-gambar senyum ceria yahoo emoticon. Begini caranya:
Copy kode di bawah ini:

<div style="overflow:auto;width:250px;height:195px;padding:1px;background:#fff;border:1px solid black"> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/69.gif"/><a href="http://www.ilpeng.com/">Blog Ilpeng dan teknologi</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif"/><a href="http://www.tutorialspss.blogspot.com/">tutorialspss</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif"/><a href="http://www.sandhioke.co.co/">knowledge sharing</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/107.gif"/><a href="http://www.sharingknowledge.co.cc/">sharing knowledge</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/65.gif"/><a href="http://www.sharingpengetahuan.co.cc/">sharing pengetahuan</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/69.gif"/><a href="http://www.ilpeng.com/">Blog Ilpeng dan teknologi</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif"/><a href="http://www.tutorialspss.blogspot.com/">tutorialspss</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif"/><a href="http://www.sandhioke.co.co/">knowledge sharing</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/107.gif"/><a href="http://www.sharingknowledge.co.cc/">sharing knowledge</a> <img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/65.gif"/><a href="http://www.sharingpengetahuan.co.cc/">sharing pengetahuan</a> </div>

hasil blogroll ceria:

Blog Ilpeng dan teknologi
tutorialspss
knowledge sharing
sharing knowledge
sharing pengetahuan
Blog Ilpeng dan teknologi
tutorialspss
knowledge sharing
sharing knowledge
sharing pengetahuan

Semoga bermanfaat

blogroll

Blogroll adalah elemen dalam blog anda sebagai tempat penyimpanan link blog anda yang lain atau link blog teman-teman blogger anda setelah sepakat tukar link.

Blogroll bertujuan untuk mempererat tali silaturahmi diantara pemilik blog/website. selain itu semakin banyak blog kita di link oleh blog lain maka semakin baik pula posisi rangking blog kita pada Search Engine. Blogroll juga akan memudahkan blogger untuk melakukan blogwalking, sebab link-link yang akan dijelajahi sudah tersedia di blog kita. So tunggu apa lagi ayo tuker link dengan ilpeng.com.

Bagaimana cara membuatnya?

Sobat tentunya tahu bahwa blogger menyediakan fitur blogroll yang dapat kita gunakan dengan mudah. Jika anda ingin menggunakannya ikuti langkah berikut ini ;
• Login akun blogger anda, Jika anda memiliki beberapa beberapa blog pilih blog mana yang akan di pasang widget blogroll kemudian klik layout
• Klik Page element, klik add a gadget lalu tambahkan blogroll
• Selanjutnya tinggal masukkan url dan nama blog yang akan ditaruh di blogroll
• selesai

Kelemahan blogroll bawaan blogger adalah jika link di klik tidak membuka jendela baru dan akan menutup jendela blog anda. Selain itu jika jumlah link blog yang banyak akan memakan tempat. Untuk mengatasi itu gunakan blogroll buatan sendiri yaitu dengan menu dropdown.


Blogroll dengan menu dropdown
Untuk membuat blogroll pada menu dropdown, seperti yang saya katakan tinggal copy script di bawah ini :

<form> <select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu> <option> - Blogroll Dropdown ilpeng.com - </option> <option value="http://www.ilpeng.com" target=”new”>Blog Ilpeng dan teknologi</option> <option value="http://www.tutorialspss.blogspot.com" target=”new” >tutorialspss</option> <option value="http://www.sandhioke.co.co" target=”new”>knowledge sharing</option> <option value="http://www.sharingknowledge.co.cc" target=”new”>sharing knowledge</option> <option value="http://www.sharingpengetahuan.co.cc" target=”new”>sharing pengetahuan</option> </select> </form>

Tulisan warna merah ganti dengan Url link milik anda dan namanya (anchornya).

Hasilnya akan seperti ini, silahkan coba di klik:

- Blogroll Dropdown ilpeng.com -
Blog Ilpeng dan teknologi
tutorialspss
knowledge sharing
sharing knowledge
sharing pengetahuan

Anda juga bisa membuat Blogroll dengan marquee
Keuntungan menggunakan marquee adalah menghemat space, tapi ilpeng.com sangat kurang merekomendasikan sebab blog menjadi terlalu banyak animasi pergerakan yang bisa memperlambat proses loading lagipula terkesan tidak rapi dan kurang professional, tapi itu kembali pada pilihan anda.

Membuat blogroll dengan marquee copy script di bawah ini:

<marquee onmouseover="this.stop()" onmouseout="this.start()"width="100%" height="150" direction="up" scrollamount="3" > < a href ="http://www.ilpeng.com" target=”new”>Blog Ilpeng dan teknologi</a> < a href ="http://www.tutorialspss.blogspot.com" target=”new”>tutorialspss</a> < a href ="http://www.sandhioke.co.co" target=”new”>knowledge sharing</a> < a href ="http://www.sharingknowledge.co.cc" target=”new”>sharing knowledge</a> < a href ="http://www.sharingpengetahuan.co.cc" target=”new”>sharing pengetahuan</a> </marquee>

hasilnya adalah seperti ini :


Blog Ilpeng dan teknologi
tutorialspss
knowledge sharing
sharing knowledge
sharing pengetahuan


Tulisan warna merah ganti dengan Url link milik anda dan namanya (anchornya).

Keterangan properties yang digunakan dalam marque:

• onmouseover="this.stop()" onmouseout="this.start()" artinya marquee akan berhenti jika ditunjuk oleh mouse
• scrollamount="3" menunjukkan kecepatan gerakan, nilai lebih tinggi untuk lebih cepat.
• direction="up" " menunjukan arah gerakan keatas, pilihan bisa "down, left,right"
• width="100%" menunjukan lebar dari marquee sebesar "100%" dari tempat dimana perintah ini ditempatkan, bisa dirubah sesuka anda 25% atau 50% atau yang lain.
• height="150" menunjukan tinggi dari marquee ", bisa dirubah sesuka anda 125 atau lainnya


Jika anda menginginkan marquee di dalam bingkai, meskipun ilpeng.com tidak merekomendasikan tapi akan di share juga caranya disini. Marque dalam bingkai.