Breadcrumb untuk Blogger

Remah roti atau jejak breadcrumb adalah bantuan navigasi yang digunakan dalam user interface. Ini memberikan pengguna cara untuk melacak lokasi mereka dalam program atau dokumen. Istilah ini berasal dari jejak remah roti yang ditinggalkan oleh Hansel dan Gretel dalam dongeng populer.

Jalur seperti Home »Label» Nama Komentar adalah remah roti.

Berikut adalah screenshot dari Breadcrumb Trail

Sekarang Anda tahu apa breadcrumb, mari kita masuk ke rincian yang sama untuk menambahkan blog Blogger Anda.

1. Pergi ke Template > Edit HTML dan centang kotak centang yang mengatakanMemperluas Template Widget .

2. Sekarang di Template, Cari

<b:include data='top' name='status-message'/>

dan segera paste di atas bahwa, sisipkan baris kode ini

<b:include data='posts' name='breadcrumb'/>

3. Sekarang menemukan

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

Jika Anda menemukan dua kejadian ini, kemudian cari yang kedua (cari satu-satunya sebaliknya) dan segera  paste di atasnya potongan kode ini

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v="http://rdf.data-vocabulary.org/#">
<span typeof="v:Breadcrumb"><a expr:href='data:blog.homepageUrl' rel="v:url" property="v:title">Home</a></span>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
 » <span typeof="v:Breadcrumb"><a expr:href='data:label.url' rel="v:url" property="v:title"><data:label.name/></a></span>
</b:if>
</b:loop>
 » <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

Kode ini hanya akan menampilkan label terakhir posting di breadcrumb. Jika Anda ingin menampilkan semua label, maka Anda harus menghapus orang-2 garis hijau kode.

4. Simpan Template

5. Jika Anda ingin membuat breadcrumb kecil kemudian pergi ke Template Designer >Lanjutan > Tambah CSS dan menambahkan Cuplikan berikut sana dan Terapkan perubahan

.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}

Sekarang Anda harus memiliki breadcrumb navigasi bekerja pada sistem anda. Ide breadcrumb asli berdasarkan Kode Hoctro dari hack breadcrumb HOCTRO . Telah dimodifikasi untuk mengakomodasi Halaman Pencarian, Halaman Label dan pasca breadcrumb Archives.The menggunakan RDF Markup breadcrumb untuk membantu Anda dalam menampilkan remah roti di Hasil Pencarian Google.

bloggerplugins.org