Cara Membuat Navigasi Breadcrumbs (SEO On Page) - Hallo sahabat Another Stuff, Pada Artikel yang anda baca kali ini dengan judul Cara Membuat Navigasi Breadcrumbs (SEO On Page), kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Belajar SEO, Artikel SEO On Page, Artikel Tips dan Trik Blogging, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Cara Membuat Navigasi Breadcrumbs (SEO On Page)
link : Cara Membuat Navigasi Breadcrumbs (SEO On Page)

Cara Membuat Navigasi Breadcrumbs (SEO On Page)

Sebenarnya saya sudah pernah posting tentang cara membuat navigasi breadcrumbs sebelumnya, tapi di tulisan cara baru membuat navigasi breadcrumbs ini agak berbeda dari yg sebelumnya.

Seperti sudah disebutkan di postingan sebelumnya tentang

pentingnya navigasi breadcrumbs

, selain bisa membantu pegunjung blog untuk mengetahui lokasi artikel, memasang navigasi breadcrumbs memang disarankan oleh mbah google.

Tulisan ini menjelaskan bagaimana membuat navigasi breadcrumbs yang bisa terindeks oleh google ketika tampil di mesin pencari.

Cara membuat navigasi breadcrumbs yang terindeks oleh Google

1. Sebelum
   

   membuat menu navigasi breadcrumbs

   jelas login dulu hahaha...


2. Kemudian pilih tab Rancangan (Design) > Edit HTML > Jangan lupa donlod dulu untuk jaga2 kalau error.


3. Langkah selanjutnya kita membuat css style dulu untuk navigasi breadcrumbs-nya, cari kode ]]></b:skin> gunakan Ctrl + F supaya lebih cepat, setelah itu tuliskan kode berikut ini tepat di atas ]]></b:skin>
   

   
   .breadcrumbs
{
padding:5px 5px 5px 0;
margin: 0 0 5px;
font-size:inherit;
font-family: Georgia, trebuchet ms, Verdana;
line-height: 1.4em;
border-bottom:4px double #000000;
}

   
   


4. Kemudian cari kode <b:include data='top' name='status-message'/> kalau ada 2 maka copas kode berikut ini di atas semua kode <b:include data='top' name='status-message'/>
   

   
   <b:include data='posts' name='breadcrumb'/>

   
   


5. Sekarang cari kode <b:includable id='main' var='top'> kalau sudah ketemu paste kode berikut ini di atasnya
   

   <b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>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'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'>
 &#187; <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>
 &#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>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'>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'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span>
</b:if></div></b:if></b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

   
   


6. Tulisan berwarna merah itulah yang membedakan dengan membuat breadcrumbs sebelumnya.


7. Untuk melihat keberhasilan dari

   
   membuat menu navigasi breadcrumbs

   ini sobat bisa cek langsung di Google Rich Snippet Tool.

Selesai deh, untuk wordpress silahkan baca di sini. selamat mencoba membuat navigasi breadcrumbs yang terindeks oleh google dan semoga bermanfaat :)

Demikianlah Artikel Cara Membuat Navigasi Breadcrumbs (SEO On Page)

Sekianlah artikel Cara Membuat Navigasi Breadcrumbs (SEO On Page) kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Cara Membuat Navigasi Breadcrumbs (SEO On Page) dengan alamat link https://anothers-stuff.blogspot.com/2012/03/cara-membuat-navigasi-breadcrumbs-seo.html

Tweet