Tutorial Cara Mengatasi Error Breadcrumb di Search Console Blogger
Beberapa waktu lalu di salah satu blog demo dari template yang saya buat muncul pesan peringatan error khususnya pada bagian Breadcrumb yang terpasang di template. Mungkin untuk beberapa template lain tidak mengalami masalah ini termasuk template blog yang blog ini dan Idntheme gunakan, namun masalah ini muncul pada template Nubie Fast yang Anda bisa download di Idntheme.
Breadcrumb yang akan saya share ini sudah menggunakan markup breadcrumb versi terbaru yaitu schema.org yang direkomendasikan mesin pencari seperti Google dan Bing.
Bagi sobat yang mengalami masalah error pada breadcrumb, silakan ikuti tips Cara Mengatasi Error Breadcrumb di Search Console Blogger berikut ini.
Cara Mengatasi Error Breadcrumb di Search Console Blogger
Jika di template sobat sebelumnya sudah terdapat Breadcrumb, silakan ganti dengan versi ini
Pertama buka halaman Blogger > Klik menu Tema dan klik tombol Edit HTML > Tambahkan kode di bawah ini tepat di atas kode <b:includable id='comment-form' var='post'>
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.pageType == "item"'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'>
<span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a class='homebread' expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
<span itemprop='name'>Home</span></a>
<meta content='1' itemprop='position'/>
</span>
<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: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 + "?&max-results=16"' 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 != "true"'>
<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>Kemudian tambahkan kode CSS berikut sebelum kode </head>
<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:#222;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:#222}
.breadcrumbs a:hover{color:#11589D}
.breadcrumbs svg{width:16px;height:16px;vertical-align:-4px}
.breadcrumbs svg path{fill:#222}
.homebread{margin:0 2px 0 0}
</style>Selanjutnya, tambahkan kode ini tepat di bawah kode <b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>Setelah itu, klik Simpan tema dan selesai.
Langkah selanjutnya cek kembali di https://search.google.com/search-console blog sobat dan klik menu Breadcrumb.
Klik pada bagian tulisan Error, setelah itu klik pada tombol Validate Fix
Selanjutnya sobat tinggal menunggu pesan perbaikan yang akan dikirmkan lewat email setelah divalidasi.
Sekian dari blogrtrwnet.blogspot.com!, semoga bermanfaat dan wassalam.