Daftar Label Kategori Model Dropdown

File Category Labels Blog Model Select Item

Daftar Label Kategori Model Dropdown - Dropdown merupakan efek untuk menampilkan item sub menu dalam diagram dengan gerakan menurun kebawah. Seperti daftar link menu navigasi blog pada umumnya, dimana jika selector <ul> digandakan lagi untuk membuat sub menu, maka saat element induk diHOVER akan menunjukkan beberapa pilihan item menu dengan efek dropdown seperti ini:

<div id="daftar label kategori">
   <ul="[class:atibut]">
     <li><a href="....">Daftar Label Kategori</a></li>
     <li><a href="....">Daftar Label Kategori</a></li>
          //menggandakan diagram ul
          <ul class="model menu">
              <li>.....</li>
              <li>.....</li>
          </ul>
   </ul>
</div>

BACA JUGA

Menghilangkan Daftar Artikel Pada Halaman Beranda



Disini yang kita butuhkan hanya satu item menu, yang nantinya akan kita buat menjadi model menu dropdown untuk menampilkan daftar label blog dengan JavaScript perintah (JavaScript Variable=[json.feed.category]), seperti ini:

document.write('<scr' + 'ipt src="' + homepage + '/feeds/posts/summary?max-results=0&alt=json-in-script&callback=showLabels"><\/scr' + 'ipt>')

DEMO SHOW



Karena modelnya seperti item menu, jadi Anda bisa menempatkan hasilnya dimana saja, atau bisa Anda gabungkan dalam selecktor <li> pada menu navigasi blog Anda, daftar label kategori model dropdown seperti ini, sudah pernah saya gabungkan dalam satu tampilan seperti ini:

» Cara Membuat Site Map Terbaru | Daftar Isi Blog
» Mengubah Breadcrumb Menjadi Menu Navigasi

Bagaimana dengan Anda?, dimana akan Anda letakkan daftar file label ini, hmmm..letakkan sesuai selera ya guys hehe..!!, yang sekiranya enak untuk dipandang. Mau membuatnya, berikut kode lengkapnya:

<style>
.file {color:#eee}
.fileLabels {color:#fff;background:red}
#wpLabels {background:red;width:27%;padding:3px}
</style>
<div id="wpLabels">
<script type="text/javascript">
//<![CDATA[
//(orange text) ganti dengan URL-Blog Anda..
var homepage = "http://sahabatblogger77.blogspot.com";
function showLabels(json) {
    var label = json.feed.category;
    document.write('<select onchange="window.open(this.value);"><option selected disabled class="file">DAFTAR LABEL CATEGORY</option>');
    for (var i = 0; i < label.length; i++) {
        document.write('<option class="fileLabels" value="' + homepage + '/search/label/' + encodeURIComponent(label[i].term) + '">' + label[i].term + '</option>');
    }
    document.write('</select>');
}
document.write('<scr' + 'ipt src="' + homepage + '/feeds/posts/summary?max-results=0&alt=json-in-script&callback=showLabels"><\/scr' + 'ipt>');
//]]>
</script>
</div>