Assalamualaikum Wr. Wb.
Selamat pagi semua, ketemu lagi nih dengan ane. Pagi ini mau berbagi ilmu yang admin baru dapet, yaitu "Cara Membuat Dropdown Menu Search Multi Label", kalo belom tahu apa sih itu, silakan lihat di widget sidebar blog ini, yang ada tulisannya "Multi Search Label".
Untuk cara kerjanya yaitu dengan mencari artikel di postingan blog sobat dengan label bukan dengan kata, yang lebih enaknya scrippt ini nanti bisa search beberapa label sekaligus. Nggak usah panjang lebar lagi, ini dia caranya.
1. Sobat login dulu ke blogger sobat
2. Cari menu Tata Letak / Layout
3. Silakan klik "tambahkan gadget" di tempat yang sobat inginkan, bisa di bawah header, di atas footer, atau di sidebar
4. Pilih "HTML/JavaScript"
5. Silakan copy semua script di bawah ini
<div class="tabs-outer">
<div class="tabs-cap-top cap-top">
<div class="cap-left"></div>
<div class="cap-right"></div>
</div>
<div class="fauxborder-left tabs-fauxborder-left">
<div class="fauxborder-right tabs-fauxborder-right"></div>
<div class="region-inner tabs-inner">
<div class="tabs section" id="crosscol">
<div class="widget HTML" id="HTML3">
<div class="widget-content">
<div id="multi-search">
<select id="cmb1" name="cmb1">
<option value="" />Label-1
<option value="Dokumen+" />Dokumen
<option value="Lain-Lain+" />Lain-Lain
<option value="Software+" />Software
<option value="Tutorial+" />Tutorial
</select>
<select id="cmb2" name="cmb2">
<option value="" />Label-2
<option value="Dokumen+" />Dokumen
<option value="Lain-Lain+" />Lain-Lain
<option value="Software+" />Software
<option value="Tutorial+" />Tutorial
</select>
<select id="cmb3" name="cmb3">
<option value="" />Label-3
<option value="Dokumen+" />Dokumen
<option value="Lain-Lain+" />Lain-Lain
<option value="Software+" />Software
<option value="Tutorial+" />Tutorial
</select>
<input onclick=" getValue() " value="Filter" type="button" />
</div>
</div>
<div class="clear"></div>
<div class="clear"></div>
</div>
</div>
<div class="tabs section" id="crosscol-overflow"></div>
</div>
</div>
<div class="tabs-cap-bottom cap-bottom">
<div class="cap-left"></div>
<div class="cap-right"></div>
</div>
</div>
<script type="text/javascript">
function getValue() {
var valcmb1 = document.getElementById("cmb1").value;
valcmb2 = document.getElementById("cmb2").value;
valcmb3 = document.getElementById("cmb3").value;
valOutput = (valcmb1 + valcmb2 + valcmb3);
window.open("/search/label/" + valOutput, "_self");
}
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == "block") {
e.style.display = "none";
} else {
e.style.display = "block";
}
}
</script>
keterangan : warna biru = bisa sobat ganti sesuai keinginan ( misal : Label ke 1, Column, dsb ) asalkan sesuai polanya
warna merah = ganti dengan label yang ada pada sobat
6. Pastekan sript di atas pada gadget HTML tadi
7. Klik Simpan/Save
Sekian postingan ane tentang Cara Membuat Dropdown Menu Search Multi Label, semoga bermanfaat. Selamat berkreasi...
Wassalamualaikum Wr. Wb.