Skip to main content

Membuat navigasi breadcrumb versi 2

Trik blogging - Sebagai kelanjutan dari posting sebelumnya yaitu  membuat navigasi breadcrumb versi 1,  kali ini ane akan share versi ke 2 nya.

Sebelum kita mulai, pernahkah sobat mengalami hal ini?

1. Template eror ketika memasang breadcrumb
2. Template tidak eror tapi breadcrumbnya tidak muncul.

Oke! mari kita lanjut.
Dalam memasang breadcrumb, poin yang pertama umumnya sangat jarang terjadi, penyebabnya hanyalah salah meletakkan kode atau tidak menuliskan kode secara lengkap ( terutama tag pembuka dan penutup  )
Poin yang kedua, umumnya terjadi pada blog dengan template MINIMA /modifikasi minima. Mengapa?
saya sendiri juga tidak tahu.. maklum, ane masih belajar. hehehe

Bagi anda pecinta template minima yang ingin buat breadcrumb navigasi akan ane kasi tutorialnya. karna itu tanpa berlambat waktu kita langsung saja.. Oke!!

1. Pertama log in dulu ke akun blog sobat.
2. Klik rancangan --> edit html --> centang kotak expand template widget.
3. Klik download template lengkap untuk mencegah terjadinya eror pada template.
4. Letakkan kode berikut di atas kode ]]></b:skin>.
.breadcrumbs {
padding:10px;
margin: 10px;
border:1px solid #000000;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}
5. Cari kode  <b:includable id='post' var='post'> ( Gunakan Ctrl + F untuk memudahkan pencarian )
6. Letakkan kode berikut tepat di BAWAHNYA.
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>

Browse &#187; <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'> &#187;
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
&#187; <span><data:post.title/></span>
</b:loop>
</b:if>
</b:loop>

</div>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<div class='breadcrumbs'>
Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/>
</div>
</b:if>
<b:else/>
<b:if cond='data:navMessage'>
<div class='breadcrumbs'>
<data:navMessage/>
</div>
</b:if>
</b:if>
7. Dan yang terakhir simpan template.


Semoga bermanfaat.

Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar