Cara Memperbaiki Error Breadcrumbs Di Blog

Pada kesempatan kali ini, saya akan memberikan sebuah tutorial cara mengatasi error breadcrumbs.

Baru-baru ini google telah melakukan banyak perubahan salah satu nya adalah google search console, untuk itulah banyak yang mengalami error seperti breadcrumbs.

Breadcrumbs merupakan sebuah menu yang berfungsi untuk mengecek dan menampilkan struktur data yang ada pada blog atau website.

Dengan adanya perubahan tersebut banyak blogger Indonesia yang mengalami dampak Error tersebut, salah satunya adalah saya yang mendapatkan email dari google tentang masalah yang terjadi pada breadcrumbs. Email tersebut berisi seperti dibawah ini :

Jika anda perhatikan, email tersebut memberikan sebuah arahan yang dimana anda harus memperbaiki masalah error pada breadcrumbs tersebut. Nah, jika anda mendapatkan email tersebut anda dapat mengatasi masalah pada breadcrumbs tersebut dengan cara mengikuti langkah-langkah dibawah ini.

Cara Mengatasi Error Breadcrumbs

Langkah 1 : masuk ke akun blogger anda.

Langkah 2 : masuk ke menu TEMA >> Edit HTML.

Langkah 3 : silahkan cari kode dengan cara menekan CTRL + F lalu ketik <b:includable id='breadcrumb' var='posts'>.

Langkah 4 : kemudian, copy kode dibawah ini lalu pastekan kode tersebut tepat DIATAS kode <b:includable id='breadcrumb' var='posts'>.

<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>

PENTING : Jika sebelumnya di blog anda sudah memasang kode breadcrumbs, maka kode breadcrumbs yang lama diganti dengan kode breadcrumbs yang baru seperti kode breadcrumbs pada langkah 4.

Langkah 5 : selanjutnya, silahkan copy kode dibawah ini lalu pastekan kode tersebut tepat DIATAS 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:#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>

Langkah 6 : kemudian, copy kode dibawah ini lalu pastekan kode tersebut tepat DIBAWAH kode <b:includable id='main' var='top'>.

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

Langkah 7 : Simpan.

Langkah 8 : masuk ke webmaster tools, lalu masuk ke menu breadcrumbs, kemudian lakukan validasi, jika sudah maka tinggal menunggu hasilnya aja.

Akhir Kata :

Itulah tutorial Cara Mengatasi Error Breadcrumbs, jika ada pertanyaan mengenai artikel diatas, anda bisa memberikan komentar dibawah ini.

Baca Juga

• Cara Setting robot txt yang benar
• Cara membuat pengalihan khusus di blog