Cara Mengatasi Error Breadcrumb Template Blogger

Romeltea | Follow @romel_tea
Cara Mengatasi Error Breadcrumb Template Blogger
Google mengirimkan notifikasi error breadcrumb kepada admin bloger yang templatenya menggunakan schema mark up di kode breadcrumb.

Error terjadi karena schema data:vocabulay.org yang digunakan sudah tidak berlaku lagi.

Namun, jika template blog Anda tidak menggunakan breadcrumbs, tidak akan menerima notifikasi error (kesalahan) itu.

Breadcrumb adalah internal link sekaligus navigasi menu yang biasa tampil di atas judul postingan blog atau di atas judul artikel.

Breadcrumb biasanya terdiri dari link ke halaman depan (Home), nama Label, dan Judul Tulisan. Misalnya: Home > Blogging > Cara Mengatasi Error Breadcrumb.

Breadcrumb dipercaya menjadi salah satu faktor SEO blog. Buktinya, Google memberitahu para blogger jika terjadi error.

Cara Mengatasi Error Breadcrumbs

Bagi yang sudah memasang breadcrumbs, kemungkinan mendapatkan error warning dari Google. Berikut ini cara mengatasinya.

1. Klik Tema > Edit HTML
2. Cari dan Ganti kode:

<div class='breadcrumbs'>
<span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'>
<a expr:href='data:blog.homepageUrl' itemprop='url' title='Home'><span itemprop='title'>Home</span></a></span>
<b:loop values='data:post.labels' var='label'> &#187;
<span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url + &quot;?&amp;max-results=7&quot;' expr:title='data:label.name' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span>
</b:loop> &#187; <span><data:post.title/></span>
</div>

dengan kode:


<div class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl' itemprop='url' title='Home'>Home</a>
<b:loop values='data:post.labels' var='label'> &#187;
<a expr:href='data:label.url + &quot;?&amp;max-results=7&quot;' expr:title='data:label.name' itemprop='url'><data:label.name/></a>
</b:loop> &#187; <span><data:post.title/></span>
</div>

3. Save!

Cara Lain Cara Mengatasi Error Breadcrumb Template Blogger

Cara lain sekaligus cara memasang breadcrumb di Blogger.

1. Klik Tema > Edit HTML
2. Copas kode berikut ini di atas kode </b:skin>. Jika sudah ada kode seperti ini, hapus dan ganti dengan kode berikut ini.

.breadcrumbs{line-height:1.2em;width:auto;overflow:hidden;padding:0;margin:0 auto 20px;font-size:90%;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:#777;font-weight:400}
.breadcrumbs a:hover{color:blue}
.breadcrumbs svg{width:20px;height:20px;vertical-align:-5px;margin:0 -3px}
.breadcrumbs svg path{fill:#c8c8c8}

3. Temukan kode <b:includable id='breadcrumb' var='posts'> ... </b:includable>
4. Hapus dan ganti dengan kode breadcrumb tanpa error berikut ini:

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:view.isSingleItem'>
<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 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'/></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=10&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>
<svg viewBox='0 0 24 24'><path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z'/></svg>
</b:loop>
<span><data:post.title/></span>
</div>
</b:if>
</b:loop>
</b:if>
</b:includable>

5. Save. Simpan template.

Itu dia Cara Mengatasi Error Breadcrumb Template Blogger. Cara di atas pula yang saya terapkan untuk mengatasi kesalahan breadcrumb di blog ini. Wasalam. (blogromeltea.blogspot.com).*


Previous
« Prev Post

No comments on Cara Mengatasi Error Breadcrumb Template Blogger

Post a Comment

No Spam, Please!

Contact Form

Name

Email *

Message *