Cara Membuat Link Select Option - HP Yitno Cara Membuat Link Select Option - HP Yitno

Bisnis Online I Affiliasi I Tutorial Blog I Tips & Trick I Motivation I SEO

Cara Membuat Link Select Option

membuat link drop down select optionDear Sahabat,
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>

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.
SHARE :

Iklan Lucu & Super Kreatif Di Dunia

Amazing..!!! - Kata itulah yang mungkin akan anda katakan tatkala melihat iklan paling kreatif & termahal di dunia berikut https://youtu.be/jYsx0nlGtJ4.
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

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

Back To Top