Cara Membuat Breadcrum Di Blog -- Teknologi Komputer kini akan memberikan tutorial tentang Cara Membuat Breadcrum Di Blog. Bagi saya breadcrum di blog itu sangat penting, karena selain untuk navigasi, breadcrum juga berfungsi sebagai penunjang seo di blog kita. Breadcrum juga bisa memperindah tampilan blog kita. Membuat Breadcrum Di Blog itu sangat mudah dan juga cepat. Selain breadcrum, kalian juga perlu memberikan navigasi yang bagus seperti sitemap jika blog kalian belum mempunyai sitemap baca juga Cara Membuat Sitemap Di Blog. Sedikit penjelasan tentang breadcrum di bawah ini.
Apa itu Breadcrum? Breadcrum adalah link yang akan mempermudah kan kalian untuk kembali ke label yang ada di blog. Biasanya berupa link horizontal yang jika di klik akan menuju ke link yang di klik.
Contoh Breadcrum |
Nah untuk Cara Membuat Breadcrum Di Blog silahkan simak langkah-langkah dibawah ini dengan cermat agar bisa terindex. Berikut ini langkah nya. Baca Juga Agar Breadcrum Terindex.
1. Pertama masuk ke blogger
2. Kemudian menuju ke opsi " Template " dan " Edit Html "
3. Kemudian Copy Kode dibawah ini :
4. Kemudan cari kode " ]]></b:skin> " ( Gunakan CTRL + F untuk lebih mudah mencari kodenya ).breadcrumbs{
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef;}
5. Kemudian Paste kode yang tadi tepat DIATAS kode " ]]></b:skin> ".
6. Jika sudah, langkah selanjutnya silahkan copy kode dibawah ini :
<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'>7. Kemudian cari kode " <b:includable id='main' var='top'> "
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>My Blog</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'>My Blog</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>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>
8. Kemudian ganti kode " <b:includable id='main' var='top'> " dengan kode yang diatas tadi.
9. Pada akhir langkah ini silahkan simpan atau pratinjau dulu agar bisa melihat hasilnya.
Sekianlah artikel yang bisa teknologi komputer bisa sampaikan. Semoga Cara Membuat Breadcrum Di Blog ini bisa bermanfaat untuk Anda.