Catatan Cara Perbaiki Error Breadcrumb pada Blogger 2020


Lama gak buka Google Webmaster Tool yang sekarang namanya sudah berubah menjadi Google Search Console. Ternyata ada 200 lebih peringatan tanda kuning yang muncul sejak Januari 2020.  Peringatan apa ya...menjadi bertanya-tanya...namun alhamdulillah hanya peringatan yang bukan merupakan kesalahan. Bisa anda lihat pada gambar berikut ini;

 Error Breadcrumb pada Blogger 2020

Langsung saja search di mbah google tentang Error Breadcrumb pada blogger ini dan akhirnya masalahnya ketemu juga. Ternyata Notifikasi Error Breadcrumb di Search Console telah dikirim ke email pada bulan januari 2020 yang lalu. Efek gak pernah baca email nih

Breadcrumb ini adalah fitur baru dari Google Search Console untuk membantu pengunjung untuk memahami lokasi mereka dalam sebuah website.

Catatan Cara Perbaiki Error Breadcrumb pada Blogger 2020

Catatan ini buat template buatan Mas Sugeng, untuk template yang lain mungkin sama juga, langsung saja kita lihat catatan yang saya ambil dari https://medium.com/ berikut ini;

  1. Login ke blogger Anda
  2. Buka menu Tema kemudian klik Edit HTML, untuk menghindari hal-hal yang tidak diinginkan Saya rekomendasikan lakukan backup template terlebih dahulu sebelum melakukan step-by-step dibawah.
  3. Tekan CTRL + F, lalu cari kode berikut:
  4. <b:includable id='breadcrumb' var='posts'>
  5. Lalu Blok kode yang dimulai pada point 3 sampai dengan </b:includable> silahkan lihat di bawah ini;
  6. <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-outer'><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><data:blog.pageName/></span> </div></div> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <b:loop values='data:posts' var='post'> <b:if cond='data:post.labels'> <div class='breadcrumbs-outer'><div class='breadcrumbs'><span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></span></a></span> &#8250; <b:loop values='data:post.labels' var='label'><span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url + &quot;?&amp;max-results=8&quot;' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span><b:if cond='data:label.isLast != &quot;true&quot;'> &#8250; </b:if> </b:loop> </div></div> <b:else/> <div class='breadcrumbs-outer'><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><b:switch var='data:blog.locale'><b:case value='id'/>Tanpa Kategori<b:default/>No Category</b:switch></span></div></div> </b:if> </b:loop> <b:else/> <b:if cond='data:blog.pageType == &quot;archive&quot;'> <div class='breadcrumbs-outer'><div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><b:switch var='data:blog.locale'><b:case value='id'/>Arsip untuk<b:default/>Archive for</b:switch> <data:blog.pageName/></span> </div></div> <b:else/> <b:if cond='data:blog.searchQuery'> <div class='breadcrumbs-outer'><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><data:blog.pageName/></span> </div></div> <b:else/> <b:if cond='data:blog.pageType == &quot;index&quot;'> <div class='breadcrumbs-outer'><div class='breadcrumbs'> <b:if cond='data:blog.pageName == &quot;&quot;'> <span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span>Daftar Artikel</span> <b:else/> <span><a expr:href='data:blog.homepageUrl' rel='nofollow'><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></a></span> &#8250; <span><data:blog.pageName/></span> </b:if> </div></div> </b:if> </b:if> </b:if> </b:if> </b:if> </b:if> </b:includable>
  7. Ganti rangkaian kode diatas (no.4) dengan kode terbaru dibawah ini :
  8. <b:includable id='breadcrumb' var='posts'> <b:if cond='data:blog.pageType == &quot;item&quot;'> <b:loop values='data:posts' var='post'> <b:if cond='data:post.labels'> <div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'> <svg viewBox='0 0 24 24'><path d='M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z' fill='#000000'/></svg> <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'> <a expr:href='data:blog.homepageUrl' title='Home' itemprop='item'> <span itemprop='name'>Home</span></a> <meta content='1' itemprop='position'/> </span> <svg viewBox='0 0 24 24'><path d='M5.5,9A1.5,1.5 0 0,0 7,7.5A1.5,1.5 0 0,0 5.5,6A1.5,1.5 0 0,0 4,7.5A1.5,1.5 0 0,0 5.5,9M17.41,11.58C17.77,11.94 18,12.44 18,13C18,13.55 17.78,14.05 17.41,14.41L12.41,19.41C12.05,19.77 11.55,20 11,20C10.45,20 9.95,19.78 9.58,19.41L2.59,12.42C2.22,12.05 2,11.55 2,11V6C2,4.89 2.89,4 4,4H9C9.55,4 10.05,4.22 10.41,4.58L17.41,11.58M13.54,5.71L14.54,4.71L21.41,11.58C21.78,11.94 22,12.45 22,13C22,13.55 21.78,14.05 21.42,14.41L16.04,19.79L15.04,18.79L20.75,13L13.54,5.71Z' fill='#000000'/></svg> <b:loop index='num' values='data:post.labels' var='label'> <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'> <a expr:href='data:label.url + &quot;?&amp;max-results=16&quot;' expr:title='data:label.name' itemprop='item'> <span itemprop='name'><data:label.name/></span> </a> <meta expr:content='data:num+2' itemprop='position'/> </span> <b:if cond='data:label.isLast != &quot;true&quot;'> <svg viewBox='0 0 24 24'><path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/></svg> </b:if> </b:loop> <svg viewBox='0 0 24 24'><path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/></svg> <span><data:post.title/></span> </div> </b:if> </b:loop> </b:if> </b:includable>
  9. Tambahkan CSS dibawah tepat diatas kode /head :
  10. <style type="text/css"> /* Breadcrumb */ .breadcrumbs{background:#fff;line-height:1.2em;width:auto;overflow:hidden;margin:0;padding:10px 0;border-top:1px solid #dedede;border-bottom:1px solid #dedede;font-size:80%;color:#888;font-weight:400;text-overflow:ellipsis;-webkit-text-overflow:ellipsis;white-space:nowrap} .breadcrumbs a{display:inline-block;text-decoration:none;transition:all .3s ease-in-out;color:#666;font-weight:400} .breadcrumbs a:hover{color:#11589D} .breadcrumbs svg{width:16px;height:16px;vertical-align:-4px} .breadcrumbs svg path{fill:#666} </style>
  11. Save/Simpan Tema, lakukan re-check menggunakan Tools Structured Data Checker dari Google. Setelah Saya lakukan re-check, kira kira nanti ada laporan berikut ini, tunggu sampai selesai kare prosesnya lama, sabar ya...


Subscribe to receive free email updates:

2 Responses to "Catatan Cara Perbaiki Error Breadcrumb pada Blogger 2020"