- Tips dan trik mempercepat koneksi internet - Tips dan trik memonitor bandwidth koneksi internet - Software lain seputar koneksi internet -

Membuat Scrollbox pada Blogspot

Oleh | Jul. 17, 2009 | Blogging, Tutorial & Trik Blogspot

Informasi seputar blogging kali ini adalah cara membuat scrollbox pada Blogspot. Fungsi dari scrollbox ini sendiri sebenarnya sudah ada dalam gadget standar blogspot, yaitu Links, dimana kita bisa menambahkan link dari url blog teman atau url lainnya. Kelemahan dari gadget ini menurut saya adalah jika kita mempunyai daftar link yang banyak, maka otomatis dalam tampilan di blog juga akan memanjang ke bawah, malah kadang pada batas dimana list artikel kita sudah habis, daftar link kita belum habis. Kita memang bisa memotongnya dengan membatasi jumlah link yang tampil, tapi karena dibatasi ini maka tidak semua link terlihat.

Fungsi dari scrollbox ini sendiri sebenernya sama dengan gadget Links yaitu membatasi, hanya saja yang dibatasi bukan jumlah linknya tapi ukuran (tinggi) dari daftar link kita, sebagai gantinya, akan diberikan scroll tersendiri dari daftar ini. Untuk lebih jelasnya langsung saja kita mulai, pertama kita masuk ke panel kontrol blog dan masuk ke tab Layout dan sub tab Page Elements.

Kemudian tentukan dimana kita akan menempatkan scrollbox ini, biasanya diletakkan pada bagian sidebar. Setelah itu tambahkan gadget HTML/JavaScript pada bagian yang kita pilih.

Langkah berikutnya masukkan script berikut ini pada gadget HTML/Javascript.

<div style="overflow:auto; height:250px; width:220px">
<ul>
<li><a href="http://alamat url link 1/" target="_blank">Link 1</a></li>
<li><a href="http://alamat url link 2/" target="_blank">Link 2</a></li>
<li><a href="http://alamat url link 3/" target="_blank">Link 3</a></li>
<li><a href="http://alamat url link 4/" target="_blank">Link 4</a></li>
<li><a href="http://alamat url link 5/" target="_blank">Link 5</a></li>
<li><a href="http://alamat url link 6/" target="_blank">Link 6</a></li>
<li><a href="http://alamat url link 7/" target="_blank">Link 7</a></li>
<li><a href="http://alamat url link 8/" target="_blank">Link 8</a></li>
<li><a href="http://alamat url link 9/" target="_blank">Link 9</a></li>
<li><a href="http://alamat url link 10/" target="_blank">Link 10</a></li>
<li><a href="http://alamat url link 11/" target="_blank">Link 11</a></li>
<li><a href="http://alamat url link 12/" target="_blank">Link 12</a></li>
<li><a href="http://alamat url link 13/" target="_blank">Link 13</a></li>
<li><a href="http://alamat url link 14/" target="_blank">Link 14</a></li>
<li><a href="http://alamat url link 15/" target="_blank">Link 15</a></li>
</ul>
</div>

Keterangan untuk script di atas adala sebagai berikut. Height itu menunjukkan tinggi dari scrollbox yang kita buat, dan width adalah lebarnya (untuk lebar samakan dengan lebar dari sidebar yang kita pilih). Link 1, Link 2, Link 3 dan seterusnya adalah nama dari Link dan alamat url link 1, 2, 3, dan seterusnya adalah url tujuan. Untuk lebih jelasnya tentang fungsi link, bisa membaca artikel tentang Hyperlink.

Setelah itu kita simpan template dan lihat hasilnya pada halaman blog.

Sebagai contoh penggunaan ScrollBox ini dapat dilihat pada blog Money Online, pada bagian My Links di situ menggunakan script di atas.

Demikian tutorial sederhana ini, semoga bermanfaat. Selamat mencoba.

Bookmark and Share

:, , , , ,

36 komentar:

36 Responses to “Membuat Scrollbox pada Blogspot”

Pages: « 1 2 3 [4] Show All

  1. 27
    Dilivio Says:

    Infonya membantu sekali mas,, Link Back ya

  2. 28
    Tumenggung tri Says:

    Thanks mas ariawijaya, blog ku jadi lumayan berkat baca-baca disini.

    tetap semangat dan tularkan ilmu pada sesama

    Salam

    Triwahyu Bambang A

  3. 29
    Rehan Says:

    Thx mas infonya.

  4. 30
    aldy Says:

    ok sob terimakasi ilmunya,bisabuat gwe bwlajar eh..

  5. 31
    2yoemt Says:

    Mas Script Buat Daftar Isi RSS Scrollbox
    Punya Ga ?
    Ko Aku Cari 2 Berbayar Semua
    Ada Yang Gratisan Tapi Ga Masuk/Kliatan Daftar isinya
    Tolong Bantu ya
    Komen Ja Di Blogku
    Ato Ga email Ja Iam_sevent_dayz@yahoo.co.id

  6. 32
    Gelora Muda CLP Says:

    thanks gan…salam sejahtera

  7. 33
    eiklil Says:

    info bagus… cuma sy mau tanya, bagaimana kalo gesernya kesamping? bukan ketas dan kebawah?

  8. 34
    blog item Says:

    thanks infonya gan,,,salam

  9. 35
    nC Says:

    ini dy yg sy cari2. thx bro ;)

  10. 36
    sygana Says:

    salam…terima kasih infonya sungguh berguna

Pages: « 1 2 3 [4] Show All

Leave a Reply