Wednesday, 18 June 2014

Cara Membuat Breadcrumb di Blog

Contoh Breadcrumb
Breadcrumb merupakan menu navigasi yang ada di bagian atas blog, sehingga tampilan blog lebih propesional jika dilihat oleh pengunjung. Dan dengan navigasi ini pun pengunjung lebih mudah mengklik kategori dalam blog anda.
Cara membuatnya pun sangat mudah, anda tinggal memasang script di bawah ini (Copas). Trik dibawah ini juga bisa membuat breadcrumb anda terindex oleh search engine seperti Google. Trik ini termasuk tip seo dalam blog ini, setelah di postingan sebelumnya saya memposting tentang Cara Mebuat Sitemap di Google Webmaster tool .
Baiklah dari pada panjang lebar inilah Trik Cara Membuat Breadcrumb di Blog adalah sebagai berikut :
    Login ke dashboard blogger anda, pilih Rancangan > Edit HTML, centang Expand widget template.
    Cari kode ini ]]></b:skin> pada template anda. Copy kode CSS dibawah ini dan paste-kan kode CSS tepat diatas kode ]]></b:skin> 

 .breadcrumbs {padding: 5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:95%; line-height:1.4em; border-bottom:3px double #e6e4e3;}
    Lanjutkan dengan mencari kode ini <b:include data='top' name='status-message'/>  pada template anda. Letakkan kode dibawah ini dibawahnya.
    <b:include data='posts' name='breadcrumb'/>
    Kemudian cari lagi kode  <b:includable id='main' var='top'> . Copy script dibawah ini dan letakkan tepat diatas kode tadi.
<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>
Setelah semuanya selesai lihat hasilnya di blog anda, apakah tampil atau tidak di atas postingan blog atau tidak. Tetapi tuggulah beberapa hari untuk proses index breadcrumb di Google. Dan lihatlah hasilnya setelah anda menunggu beberapa hari.


Dipublikasikan pada : 15:21 by :Ujang Kurnia Sandi

1 comments:

Unknown said...

sepengetahuan saya breadcrumb itu sama dengan katagori yang bisa cepat terindeks kalau bagus dan unik, trims infonya :D

Post a Comment

 
Design by Kurnia Theme | Bloggerized by Ujang Kurnia Sandi