Dengan menambahkan fasilitas menu dropdown dalam blog, manfaatnya sangat besar. Apalagi bagi para sesepuh blogger ( alias blogger yang sudah lama berdiri ), pasti sangat membutuhkan menu ini. Karna setiap posting di blog, setiap bulan maka postingan kita akan terarsip otomatis secara rapi, dan arsip akan tampil di sidebar. Kendalanya, bagaimana jika kita sudah ngeblog setahun, maka arsip januari akan tampil berjejer di sidebar kita. Untuk mengantisipasinya, kita bisa membuat pull-down menu seperti dibawah ini:
Jadi, berapa bulan/tahun kita blogging di blogger/blogspot, menu bulan-bulan tsb tidak akan memenuhi dan berjejer panjang di sidebar kita. Yg tampak hanya nama "Archives", baru setelah di klik, akan muncul nama bulan arsip-arsip kita.
Untuk membuat arsip pulldown ini ada dua yakni untuk blogger dengan template klasik, dan template baru. Untuk template klasik langkahnya yaitu :
1. Login ke blogger.com dg id Anda
2. Klik Template
3. Di bagian sidebar blog Anda bagian archives, ada kode html sbb:
&<BloggerArchives>
<a href="<$BlogArchiveURL$"$gt;'><$BlogArchiveName$></a>
</BloggerArchives>
4. Nah, ganti kode di atas dg kode html di bawah ini:
<select name="archivemenu"
onchange="document.location.href=this.options[this.selectedIndex].value;">
<option selected>- Archives -</option>
<BloggerArchives>
<option value="<$BlogArchiveURL$>"><$BlogArchiveName$></option>
</BloggerArchives>
</select>
5. Apabila selesai, klik SAVE CHANGES. Bila sudah DONE, klik REPUBLISH.
6. 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
Nah keterangan di atas tadi merupakan langkah-langkah untuk membuat menu Dropdown untuk Arsip, Sekarang bagai mana caranya membuat menu dropdown yang di dalam nya ada linknya, saya ambil contoh untuk menu Dropdown milik saya pribadi yang berada di sebelah kanan atas yang berisi tulisan “ blog tutorial “. Untuk membuatnya silahkan anda copy kode HTML di bawah :
<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 duluan</OPTION>
<option value="isi dengan addres yang ingin di tuju">tulisan di sini yang akan muncul</option> </select></form>
Sebagai contoh untuk menu Dropdown milik saya :
<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>
<option>- Ichinx Warehouse -</option>
<option value="http://learn-website.blogspot.com/search/label/webmaster">Webmaster</option>
<option value="http://learn-website.blogspot.com/search/label/blogging">Blogging</option>
<option value="http://http://learn-website.blogspot.com/search/label/promosi-website">Promosi Website</option>
<option value="http://learn-website.blogspot.com/search/label/tips-n-trick">Tips N Trick</option>
<option value="http://learn-website.blogspot.com/search/label/free-download">Free Download</option>
</select></form>
Hasilnya akan seperti ini :
Selamat Mencoba...!!!
Tuesday 30 June 2009
Membuat Menu Dropdown
Subscribe to:
Post Comments (Atom)
Recent Comments
Blog Archive
-
▼
2009
(70)
-
▼
June
(53)
- Memberikan Simbol Yahoo ( Emoticons )
- Posting Kode HTML di Artikel
- Membuat efek Refresh
- Membuat Link dan Memodifikasi Link
- Membuat Text Berjalan ( Marque )
- Membuat Menu Dropdown
- Text Area
- Readmore pada template klasik
- Posting Artikel
- Setting Huruf dan Warna
- Setting Blog
- Membuat Blog di Blogspot
- Pasang Kode Tuker Link
- Buat Logo & Image Button
- Cara Daftar Search Engine
- Modif Image Header
- Membuat Template Blogspot menjadi 3 Columns
- Memberi warna pada layout komentar
- Membuat Background Efek 3D di Sidebar Title
- Membuat Kolom Disamping Header
- Membuat Menu Navigasi
- Posting code html di artikel agar tidak dianggap p...
- Upload File Icon dan Ganti Icon Blog
- Title Tag Optimization
- Tips Yahoo!
- Text Hyperlink Optimization
- Promosi Web Ruang Publik
- Meraih Rangking Teratas
- Meningkatkan Page Rank
- Link Building and Link Popularity
- Keyword Research Tips
- Mencari WebSpace GRATIS
- Header Tag Optimization
- Body Text Optimization
- Pengenalan Kode HTML
- Bekerja dengan Paragraph
- Mengutak-atik Huruf
- Menyisipkan Gambar
- Membuat text berjalan
- Membuat garis pembatas
- Membuat formulir
- Membuat Daftar
- Link atau Kaitan
- Keterangan Situs (META)
- Karakter Khusus
- Indentasi
- Cara Membuat Tabel
- Belajar membuat Header
- Belajar Membuat Frame
- Alignment atau Perataan
- Study Website
- About Me
- Create a Free Website? Think Twice About It!
-
▼
June
(53)
Komentar :
Post a Comment