Membuat Breadcrumb di HTML 5 mirip namun berbeda dengan XML. Untuk kamu yang pakai template HTML 5 seperti blog saya yang lain di Wagu Indonesia (klik salah satu judul untuk melihatnya). Baik, untuk Cara Membuat Breadcrumb di HTML 5 berikut caranya
Log In ke Blog, (tentunya blog kamu)
Klik Rancangan, / Design
Klik Edit HTML,
Kalau masih ragu Download Template Lengkap dulu,
Centang ,
Download dulu untuk jaga-jaga bila terjadi kesalahan
Cari kode <nav> kode ini adalah kode yang baru di HTML 5. Gunakan F3 atau Ctrl+F untuk mempermudah pencarian,
Pastekan kode di bawah ini di bawah kode <nav>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumbs'>
Browse : <a expr:href='data:blog.homepageUrl'>Home</a> » <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'> , </b:if>
</b:loop>
</b:if> » <a expr:href='data:post.url'><data:post.title/></a>
</div>
</b:if>
</b:if>
Lalu
Jika, cara di atas gagal, coba cari kode seperti di bawah ini
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
Sobat tinggal pastekan kode di bawah ini di atas kode tersebut
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumbs'>
Browse : <a expr:href='data:blog.homepageUrl'>Home</a> » <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'> , </b:if>
</b:loop>
</b:if> » <a expr:href='data:post.url'><data:post.title/></a>
</div>
</b:if>
</b:if>
Lalu
Berhasil dah, cukup sekali jalan dan berhasil . Seperti itu Membuat Breadcrumb di HTML 5. Cukup simpel dan memudahkan kita. Happy blogging!
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumbs'>
Browse : <a expr:href='data:blog.homepageUrl'>Home</a> » <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'> , </b:if>
</b:loop>
</b:if> » <a expr:href='data:post.url'><data:post.title/></a>
</div>
</b:if>
</b:if>
Lalu
Jika, cara di atas gagal, coba cari kode seperti di bawah ini
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
Sobat tinggal pastekan kode di bawah ini di atas kode tersebut
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumbs'>
Browse : <a expr:href='data:blog.homepageUrl'>Home</a> » <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'> , </b:if>
</b:loop>
</b:if> » <a expr:href='data:post.url'><data:post.title/></a>
</div>
</b:if>
</b:if>
Lalu
Berhasil dah, cukup sekali jalan dan berhasil . Seperti itu Membuat Breadcrumb di HTML 5. Cukup simpel dan memudahkan kita. Happy blogging!