Blognya Antok

Selamat siang sobat blogger :k Kali ini saya akan mengajari anda untuk membuat Breadcrumbs di Blog. Kalau boleh tahu apa sih breadcrums itu? Breadcrumbs adalah navigasi yang digunakan untuk pengunjung agar mengetahui di kategori apa dia membaca artikel. Kalau anda masih bingung :v lihat aja gambar dibawah ini
Dari gambar diatas sudah jelas Tutorial Blog adalah kategori yang pengunjung baca. dan Cara Membuat Emoticon di postingan adalah artikel yang dia baca. Jadi pengunjung sekarang berada di kategori Tutorial Blog. Dimana teman-teman sudah jelas kan :D. Breacrumbs ini katanya juga baik untuk SEO. Jadi anda harus wajib memasangnya. Oke kalau gitu langsung saja simak tutorialnya dan terapkan di blog anda.

• Login ke akun blogger anda
• Klik template

• Klik Edit HTML
• Centang Expand Widget Template
• Letakkan kode dibawah ini diatas kode ]]></b:skin>

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

• Keudian cari kode <b:includable id='main' var='top'> 
• Hapus kode tersebut dan ganti dengan kode dibawah 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' property='v:title' rel='v:url'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
» <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</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"'>
<!-- ViperGoy 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>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>

• Langkah terakhir save template :)

Untuk postingan tutorial blog kali ini cukup itu saja. jangan lupa baca tutorial sebelumnya Cara Membuat Emoticon Di Postingan. Sekian dulu dari saya semoga bermanfaat.. Salam blogging.. :x