CARA PASANG BREADCRUMB DIBLOG

Selamat berjumpa sahabat blogger..kali ini saya coba share tutorial blog tentang cara pasang breadcrumb diblog. Tutorial blog ini saya dapat dari blog teman sudah memasang breadcrumb ini..Memasang BreadCrumb adalah salah satu trik ngeblog agar blog lebih SEO Friendly. BreadCrumb berfungsi untuk memudahkan user untuk menavigasi halaman blog atau website.

Selain untuk mempermudah user, BreadCrumb juga termasuk teknik SEO yang sangat disenangi search engine karena robot akan dengan gampang mengcrawl halaman blog kita.
 

Mari kita langsung saja mengerjakan Cara Memasang BreadCrumb Pada Blog Blogger Sebagai berikut :

 
1. Masuk pada ID blogger anda di Blogger.com.
2. Masuk pada tata letak atau layout kemudian pada tab klik edit HTML

Sebelum memasang BreadCrumb backup lah template Anda terlebih dahulu [Click Download Full Template and please back up your template first. Untuk menghindari bila sewaktu-waktu ada kesalahan]

3. 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.

4. Carilah kode-kode berikut ini:

a.  Cari kode berikut: <b:include data='top' name='status-message'/>

     Ganti dengan kode berikut:

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

b.  Cari kode berikut: <b:includable id='main' var='top'>

     Ganti dengan kode berikut:

<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'>

c.  Cari kode berikut ini : ]]></b:skin>

    Ganti dengan kode berikut:

.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)
Demikian tutorial memasang breadcrumb di blog Blogger... Semoga Bermanfaat..

Sumber : http://reformasibaru.blogspot.com/2012/06/cara-mudah-memasang-breadcrumb-di-blog.html