RSS Feed

23 Jul 2010

Cara Membuat Menu DropDown

Dalam blog pada setiap posting kita akan disipan ke dalam sebuah arsip secara otomatis pada setiap bulannya. Setiap memasuki bulan baru, seperti Januari, maka arsip bulan Desember akan tampil di sidebar. Masalahnya, kalau kita sudah ngeblog setahun, maka arsip dari Januari sampai Desember akan berjejer di sidebar kita. Cara yang praktis untuk mengatasi masalah tersebut adalah dengan membuat pull-down menu. Untuk membuat arsip pull-down ada dua cara untuk blogger, yaitu pada template klasik dan template baru. Untuk anda yang menggunakan template klasik langkah-langkahnya seperti di bawah ini:


  1. Login ke blogger.com dengan id Anda

  2. Klik Template

  3. Pada bagian sidebar blog Anda bagian archives, ada kode html sbb:

  4. &<BloggerArchives>

    <a href="<$BlogArchiveURL$"$gt;'><$BlogArchiveName$></a>

    </BloggerArchives>
  5. Ganti kode di atas dg kode html di bawah ini:



  6. Apabila selesai, klik SAVE CHANGES. Bila sudah DONE, klik REPUBLISH.

  7. Selesai.


Untuk anda yang memakai template baru, langkahnya lebih mudah yaitu :

  1. Login dulu, tentunya dengan id anda

  2. Klik LAYOUT

  3. Klik PAGE ELEMENTS, cari element (kotak) yang bertuliskan Blog Archive

  4. Klik Edit pada kotak Blog Archive tadi

  5. Di samping tulisan Style ada beberapa radio button, pilih radio button yang bertuliskan Dropdown Menu dengan cara memberi tanda tik/cek

  6. Klik Save Changes

  7. Selesai


Sekarang bagaimana cara membuat menu dropdown yang di dalam nya terdapat link. Untuk membuatnya silahkan anda copy kode HTML di bawah ini:

<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu><option value=0 selected>tulisan disini yang akan muncul terlebih dahulu</OPTION>

<option value="isi dengan link addres yang diinginkan">tulisan di sini yang akan muncul</option> </select></form>

Contohnya:

<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>

<option>- Blog Tutorial -</option>

<option value="http://dhanyptk-web.blogspot.com/2010/07/membuat-blog-di-blogspot.html">Membuat Blog di Blogspot</option>

<option value="http://dhanyptk-web.blogspot.com/2010/07/cara-settng-blog-blogspot.html">Cara Setting Blog (Blogspot)</option>

<option value="http://dhanyptk-web.blogspot.com/2010/07/cara-membuat-read-more-pada-template.html">Cara Membuat Blog di Template Klasik</option>

<option value="http://dhanyptk-web.blogspot.com/2010/07/membuat-text-area.html">Cara Membuat Text Area</option>

</select></form>

Hasilnya:



Semoga sukses...!

1 komentar:

revolterdie mengatakan...

Mantap sob..
Ni komen gua yang pertama nich...
dan pertama juga knjunan... dirunggu ya sobat blogger idonesia, tetap maju.
FOLLOW SAYA PASTI SAYA FOLLOW BALIK. ASAL TINGGALKAN KOMENTAR.....
http://kiri-jalan-terus.blogspot.com/

Posting Komentar