Rabu, 04 April 2012

Cara Membuat Breadcrumbs Di Blogspot


Panduan Blogspot kali ini kita akan membahastentang cara membuat breadcrumds di blogspot.Mungkin dari beberapa sobat blogger sekalian ada yang belum mengetahui fungsi dan manfaat dari breadcrumds ini.Breadcrumds berguna agar para pengunjung blog kita athu dimana lokasi mereka berada di dalam dokumen blog kita.Coba sobat lihat gambar di samping.Cara membuatnya tidaklah terlalu sulit,sobat hanya membutuhkan waktu beberapa menit saja.


Bagi sobat yang berminat memasang breadcrumds di blog,silahkan ikuti beberapa langkah berikut
1.Login ke akun blogger sobat
2.Klik menu Rancangan
3.Klik Edit HTML
4.Centang Expand Template Widget
5.Cari kode  ]]></b:skin>  
.6.Masukan kode berikut tepat di atas kode  ]]></b:skin> 

.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef;
}
7.Kemudian cari kode berikut  <div class='post hentry'> 
agar lebih cepat menemukan kode tersebut,gunakan Ctrl+F
8.Jika sudah ketemu,masukan kode di bawah ini tepat di bawah kode  <div class='post hentry'>

<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> &#187;
<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 != &quot;true&quot;'> , </b:if>
</b:loop>
</b:if> &#187; <data:post.title/>
</div>
</b:if>
</b:if>
8.Klik SIMPAN
9.Selesai.

Bagi sobat yang menggunakan tampilan antarmuka blogger yang diperbarui,silahkan ikuti beberapa langkah berikut
1.Login ke akun blogger sobat.
2.Klik Menu Template
3.Klik Edit HTML
4.Centang Expand Template Widget
5.Cari kode  ]]></b:skin>  

.6.Masukan kode berikut tepat di atas kode  ]]></b:skin> 



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

7.Kemudian cari kode berikut  <div class='post hentry'> 

agar lebih cepat menemukan kode tersebut,gunakan Ctrl+F
8.Jika sudah ketemu,masukan kode di bawah ini tepat di bawah kode  <div class='post hentry'>


<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> &#187;
<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 != &quot;true&quot;'> , </b:if>
</b:loop>
</b:if> &#187; <data:post.title/>
</div>
</b:if>
</b:if>

8.Klik SIMPAN
9.Selesai.

Coba sobat lihat hasilnya.Semoga postingan saya tentang cara membuat breadcrumds di blogspot bisa bermanfaat ( sumber )

Tidak ada komentar:

Posting Komentar