Cara Membuat Breadcrumbs

Cara Membuat Breadcrumbs sangat mudah. Cara Menambah Breadcrumbs Di Blogger dan fungsi Breadcrumbs kali ini saya akan membahasnya di sini. Breadcrumb atau breadcrumb trail adalah bantuan navigasi yang dipakai untuk mengetahui jejak asal dari lokasi dalam sebuah bog/website, program atau dokumen.

Apa ini dianjurkan oleh Google?
 
Dari kebanyakan blogger berkata Iya. Breadcrumb akan menambah SEO suatu artikel di blog.

CARA MEMBUAT BREADCRUMBS DI BLOGGER atau BLOGSPOT 

1. Masuk ke blogger -> Template -> Edit HTML -> centang (kasih tanda tik) Expand Widget Template(jangan lupa).

 Tips: 
  • Cara mencari kode di template blogger, tekan CTRL+F -> masukkan kode yang dicari dikotak yang tersedia.
  • Dalam meng-copy kode, klik "View Plain" -> copy kodenya.
2. Carilah kode-kode berikut ini:
  • Cara kode berikut: <b:include data='top' name='status-message'/>
  • Ganti dengan kode berikut:
view plainprint?
<b:include data='top' name='status-message'/>  
<b:include data='posts' name='breadcrumb'/> 
3. Lanjutkan dengan kode di bawah ini:
  • Cari kode berikut: <b:includable id='main' var='top'>
  • Ganti dengan kode berikut:
view plainprint?
<b:includable id='breadcrumb' var='posts'>  
<b:if cond='data:blog.homepageUrl == data:blog.url'>  
<!-- No breadcrumb on home page -->  
<b:else/>  
<b:if cond='data:blog.pageType == "item"'>  
<!-- breadcrumb for the post page -->  
<p class='breadcrumbs'>  
<span class='post-labels'>  
<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 == "true"'> »  
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>  
</b:if>  
</b:loop>  
<b:else/>  
»Unlabelled  
</b:if>  
» <span><data:post.title/></span>  
</b:loop>  
</span>  
</p>  
<b:else/>  
<b:if cond='data:blog.pageType == "archive"'>  
<!-- breadcrumb for the label archive page and search pages.. -->  
<p class='breadcrumbs'>  
<span class='post-labels'>  
<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>  
</span>  
</p>  
<b:else/>  
<b:if cond='data:blog.pageType == "index"'>  
<p class='breadcrumbs'>  
<span class='post-labels'>  
<b:if cond='data:blog.pageName == ""'>  
<a expr:href='data:blog.homepageUrl'>Home</a> » All posts  
<b:else/>  
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>  
</b:if>  
</span>  
</p>  
</b:if>  
</b:if>  
</b:if>  
</b:if>  
</b:includable>  
<b:includable id='main' var='top'> 
4. Cari kode dibah ini :
  •  Cari kode berikut: ]]></b:skin>
  •  Ganti dengan kode berikut:
view plainprint?
.breadcrumbs {  
padding:5px 5px 5px 0px;  
margin: 0px 0px 15px 0px;  
font-size:95%;  
line-height: 1.4em;  
border-bottom:3px double #e6e4e3;  
}  
]]></b:skin> 
 5. Simpan Template. (SELESAI)

Subscribe to receive free email updates: