Rurienet: Menu Breadcrumb Untuk Blogspot

Wednesday, April 27

Menu Breadcrumb Untuk Blogspot

Membuat menu breadcrum diblogspot untuk orang sekelas saya adalah hal sangat menjengkelkan.Bagaimana tidak,kalau kita search digoogle untuk membuat menu breadcrumb,pastinya banyak situs-situs yang membagikan kodenya,yang bikin saya pusing tujuh keliling setiap kode yang saya ambil dari situs-situs tersebut,begitu dipasang diblog saya hasilnya selalu error.Setelah cape keliling kesana kemari akhirnya dapat juga di Blognya Kang Roni

O ya,bagi yang belum tau apa itu menu breadcrumb adalah menu yang menunjukan kepada pengunjung bahwa dia sedang berada dimana ketika berkunjung disuatu situs.Biasanya menu breadcrumb letaknya diatas posting atau disekitar sidebar.Contohnya seperti diblog ini,di atas tanggal posting,ada tulisan browse > home > menu breadcrum untuk blogspot..Nah itu yang disebut menu breadcrumb.

Untuk membuatnya diblogspot kodenya saya dapat dari Blognya Kang Roni,Saya ucapkan Terimakash sekali lagi buat kang roni yang sudah membagikan ilmunya

Ok untuk membuatnya seperti biasa,Edit HTML.Pertama cari kode ini:

<b:includable id='main' var='top'>

Bila sudah ketemu,letakkan kode berikut ini diatasnya
<b:includable id='breadcrumbs' var='post'> <b:if cond='data:blog.pageType == "item"'> <p class='breadcrumbs'> <span class='post-labels'> <b:if cond='data:post.labels'> Browse: <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> &gt; <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast == "true"'> <a expr:href='data:label.url' rel='tag'> <data:label.name/></a> </b:if> </b:loop> <b:if cond='data:post.title'> &gt; <b><data:post.title/></b> </b:if> </b:if> </span> </p> </b:if></b:includable>

Langkah selanjutnya cari kode ini
<b:if cond='data:post.dateHeader'>

Lalu pasang kode ini diatasnya
<b:include data='post' name='breadcrumbs'/>

Terakhir letakan kode ini sebelum ]]></b:skin>

.breadcrumbs { border-bottom:1px dotted #000; margin:2em 0 0.5em; padding:0 0 0.5em; }

Simpan temple anda dan lihat hasilnya..

0 Komentar:

Post a Comment