Breadcrumb yaitu salah satu trik penunjang SEO. Namun belakangan ini saya menemui breadcrumb blogger yang yang sangat bagus saat di pencarian google. saya mencoba beberapa trik hack breadcrumb atau sebuah tautan internal pada bagian atas atau bawah laman yang memungkinkan pengunjung untuk menavigasi balik ke bagian sebelumnya. Nah trik yang saya tulis ini pun saya baru memakainya soalnya beda pemasangan dengan trik pemasangan terdahulu dan yang paling jelas adalah perbedaan kode yang digunakan dan penempatannya. Oke saya mulai...
Demo
Cara Pasang Breadcrumbs Blogger SEO Friendly.
1. Masuk ke Layout -> Edit HTML -> cetang kotak kecil disamping tulisan Expand Widget Templates.
2. Sebelum di edit sebaiknya sobat download full template, jaga jaga jika terjadi kesalahan.
3. Kemudian masukan kode CSS berikut diatas kode ]]></b:skin> gunakan from pencarian di browser sobat tekan Ctrl F.
.breadcrumbs {
border-bottom:1px dotted #999;
margin:2em 0 0.5em;
padding:0 0 0.5em;
font-size:10px
}
Kode CSS diatas bisa Anda modifikasi sesuai tampilan laman sobat.
4. Cari kode HTML : <b:includable id='main' var='top'> gunakan from pencarian di broswer sobat tekan Ctrl F.
5. Jika sudah ketemu ganti kode tersebut dengan kode HTML berikut ini (silahkan bilih salah satu no V.1 atau V.2):
Kode HTML v.1
<b:includable id='breadcrumbs' var='post'>
<b:if cond='data:blog.pageType == "item"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
Go  :
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> >
<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:if cond='data:post.title'>
> <b><data:post.title/></b>
</b:if>
</b:if>
</span>
</p>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
Kode HTML v.2
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</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'>
<b:if cond='data:label.isLast == "true"'>
» <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:if>
</b:loop>
» <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</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'/>
Note : Pilih salah satu ya Sob.. sama SEO Friendly nya kok!!!
6. Untuk Kode V.1 belum selesai silahkan cari kode HTML : <b:loop values='data:posts' var='post'> ganti dengan kode HTML : <b:include data='posts' name='breadcrumb'/>
7. Sudah selesai Klik Save template.
Untuk percobaan silahkan buat posting dan berikan label, dan cobalah cari dengan label yang diberikan atau keyword untuk mencari postingan sobat, semoga trik seo dengan breadcrumb ini berhasil dan bermanfaat Amin.
Demo
Cara Pasang Breadcrumbs Blogger SEO Friendly.
1. Masuk ke Layout -> Edit HTML -> cetang kotak kecil disamping tulisan Expand Widget Templates.
2. Sebelum di edit sebaiknya sobat download full template, jaga jaga jika terjadi kesalahan.
3. Kemudian masukan kode CSS berikut diatas kode ]]></b:skin> gunakan from pencarian di browser sobat tekan Ctrl F.
.breadcrumbs {
border-bottom:1px dotted #999;
margin:2em 0 0.5em;
padding:0 0 0.5em;
font-size:10px
}
Kode CSS diatas bisa Anda modifikasi sesuai tampilan laman sobat.
4. Cari kode HTML : <b:includable id='main' var='top'> gunakan from pencarian di broswer sobat tekan Ctrl F.
5. Jika sudah ketemu ganti kode tersebut dengan kode HTML berikut ini (silahkan bilih salah satu no V.1 atau V.2):
Kode HTML v.1
<b:includable id='breadcrumbs' var='post'>
<b:if cond='data:blog.pageType == "item"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
Go  :
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> >
<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:if cond='data:post.title'>
> <b><data:post.title/></b>
</b:if>
</b:if>
</span>
</p>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
Kode HTML v.2
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</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'>
<b:if cond='data:label.isLast == "true"'>
» <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:if>
</b:loop>
» <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</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'/>
Note : Pilih salah satu ya Sob.. sama SEO Friendly nya kok!!!
6. Untuk Kode V.1 belum selesai silahkan cari kode HTML : <b:loop values='data:posts' var='post'> ganti dengan kode HTML : <b:include data='posts' name='breadcrumb'/>
7. Sudah selesai Klik Save template.
Untuk percobaan silahkan buat posting dan berikan label, dan cobalah cari dengan label yang diberikan atau keyword untuk mencari postingan sobat, semoga trik seo dengan breadcrumb ini berhasil dan bermanfaat Amin.
No comments:
Write komentar