Fungsi blogroll selain untuk mengetahui update terbaru postingan sahabat juga untuk mempermudah blogwalking. Blogroll biasanya terletak pada sidebar blog. Namun ada juga yang terdapat pada laman mandiri. Modelnya pun bermacam-macam sesuai selera sang pemilik blog. Ada yang meletakkannya dalam menu scroll, ada juga yang menyembunyikannya dalam spoiler cantik agar tidak memakan tempat.
Jika kita berselancar menggunakan operamini atau handphone, maka blog yang kita kunjungi akan secara otomatis menampilkan versi mobile terutama platform blogspot. Asalkan sang pengelola situs mengaktifkan fitur mobile. Kalau nggak diaktifkan, ya tetep seperti tampilan desktop pada umumnya.
Untuk template standar blogspot sendiri, manakala seseorang mengakses situs lewat hape, maka kumpulan laman mandiri yang terdapat dibawah header akan berubah menjadi menu drop down. Menu itulah yang akan kita buat pada tutorial kali ini. Caranya adalah dengan memanfaatkan perintah select - option. Sekilas memang mirip dengan script google pelempar url yang pernah saya bahas, hanya ada penambahan dan pengurangan kode saja.
Berikut kode untuk membuat link drop down:
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Link Sahabat</option>
<option value="alamat url">nama Link 1</option>
<option value="alamat url">nama Link 2</option>
<option value="alamat url">nama Link 3</option>
</select>
<option value="0" selected>Link Sahabat</option>
<option value="alamat url">nama Link 1</option>
<option value="alamat url">nama Link 2</option>
<option value="alamat url">nama Link 3</option>
</select>
Penjelasan:
1. Ganti tulisan alamat url dengan alamat blog temen anda
2. Ganti nama link dengan nama yang mudah diingat
3. Jika sahabat mengerti css, silahkan kreasikan sendiri
Hasilnya seperti dibawah ini:
Silahkan di uji coba apakah script-nya berjalan dengan baik atau tidak.
17 Komentar untuk "Cara Membuat Link Select Option"
Selain mempermudah blogwalking, menu drop down ini juga bisa kita gunakan untuk menghemat tempat di sidebar atau laman mandiri kita.
lanjutGan.. blogrol n scrool sepertinya punyaku ga ada deh bray
Boleh dicuba nanti :)
AKu malah pengennya pengen punya blogrool yang sifatnya ku tempatin khusus gitu mas.
wah cuma gitu sajah toh, simple juga ya
sep mas, biar blog tambah lengkap dan mempermudah para pengunjung :)
yup sob, sangatbermanfaat, selain menghemat t4 juga terlihat simpel
Bagus nih mas Hadi. Saya izin save ya.
Eh, ttg AdRewa, saya pingin nanya2, soalnya gak berhasil membuat tampilan iklannya. KAcau malah jadinya dan tidak berhasil muncul. Boleh kan?
di belakang value bisa ditambah '_blank" biar kalau di klick kebukanya di halaman baru
Bisa dicoba mas, biar nggak makan tempat link link yang tercecer di blog :D
oh mudah juga ya mas membuatnya..bisa buat pengganti label kah ini?
Pak Yitno emang ahlix hp, sesuai namax Hp Yitno *smile
wah bagus nih... memang oke ya soal kode meng kode
hemat tempat tapi aku sukanya yang keliatan semua hehehe
pas banget buat yang gak suka macam2 widget
waaah bisa rapi ya kalo gitu...
bisa digulung...
:)
Informasi Tambahan:
Agar link yang di klik membuka tab baru, sahabat bisa menambahkan perintah blank. Contoh penggunaannya seperti dibawah ini:
<select onchange="window.open(this.options[this.selectedIndex].value, '_blank')" style="width:125px; color:#7B7B7B; font-family:arial; line-height:15px; font-size:12px; background:#ffffff" name="menu" size="1">
1. Silakan buka Daftar Isi untuk melihat artikel menarik lainnya
2. Komentar sobat adalah investasi besar untuk meningkatkan jumlah pengunjung ke Blog Sobat