Selamat Datang

Dunia Informasi Tanpa Batas

KSKS BLOG

Postingan Terbaru:

Go

Cara Membuat Breadcrumbs SEO Friendly di Blog

Jumat, 19 Juli 2013

Cara Membuat Breadcrumbs SEO Friendly di Blog
Breadcrumbs SEO Friendly? Siapa yang tidak tahu Breadcrumbs... Yap, Breadcrumbs membuat blog kita menjadi SEO Friendly dan membuat robot Google akan mudah mencari blog kita dengan menggunakan SEO Friendly... Bagi anda yang ingin membuat Breadcrumbs SEO Friendly, simak berikut ini:

1.Login ke Blogger
2.Pilih Template
3.Klik Edit HTML
4.Cari kode ]]></b:skin>
5.Letakkan kode dibawah ini di atas kode ]]></b:skin>
 
.breadcrumbs{
padding:0px 5px 5px 0;
margin-bottom:20px;
font-size:11px;
color:#5B5B5B;
border-bottom:1px dotted #bbb;
}
7.Cari kode di bawah ini
   <b:includable id='post' var='post'>
  <div class='post'>
8.Letakkan kode dibawah ini diatas kode diatas
 <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag' title='Home'>Home</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- 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' title='Home'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
 &#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' expr:title='data:label.name' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
 &#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag' title='Home'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType != &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
9.Pratinjau untuk melihat hasilnya
10.Jika sudah cocok, Simpan Template

Semoga Bermanfaat :)

5 komentar:

  1. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  2. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  3. ini bisa buat wordpress gak gan, atau hanya bisa terapin kodenya di blogger doank ya? lagi nyari sih tutorial tentang cara membuat breadcrumbnya.....
    ini blog ane gan Bisnis Online Indonesia

    BalasHapus

Catatan: (memasukan item pada komentar)
Untuk menyisipkan video, gunakan tag <i rel="youtube">URL YOUTUBE ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA...</i>
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA...</i>
Untuk menyisipkan kode panjang, gunakan tag <i rel="pre">KODE ANDA...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <strong>TEKS ANDA...</strong>
Untuk menciptakan efek huruf miring gunakan tag <em>TEKS ANDA...</em>