Memperbaiki warning breadcrumb, Kemarin malam saya mendapatkan notifikasi dari Google Search Console tentang adanyara error Data-Vocabulary.org Schema Deprecated. Salah satu blog saya memang menggunakan schema vocabulary dalam templatenya.

Saya pun memiliki pikiran kalau hal yang sama akan terjadi di beberapa blog atau website orang lain juga. Karena Google hari ini secara resmi mengatakan kalau schema vocabulary termasuk usang dan tidak akan dipakai lagi.

Maka apabila kalian masih memakai schema vocabulary dalam templatenya pasti akan mendapatkan notifikasi error di google search console.

Lalu bagaimana cara memperbaikinya? Caranya tidak terlalu sulit, hanya mengganti schema vocabulary dengan schema terbaru dari schema.org.

Apa Itu Data Struktur?

Saya sudah panjang lebar mengenai pentingnya data struktur baik untuk blog atau website. Pembahasannya bisa dilihat di Pentingkah Struktur Data Untuk Blog? 

Pada Intinya data terstruktur penting untuk SEO karena akan memudahkan Google untuk memahami apa halaman Anda dan situs web Anda. Google perlu mencari tahu halaman apa yang akan ditampilkan di hasil pencarian. Menggunakan data terstruktur seperti berbicara dengan Google, memberi tahu Google tentang apa situs Anda. Itu akan membantu peringkat Anda.

Cara Memperbaiki Data-Vocabulary.org Schema Deprecated Menggunakan Microdata HTML

Untuk memperbaiki error data vocabulary schema caranya silahkan ikuti panduan dibawah ini.

1. Masuk ke akun blogger kalian

2. Pilih Tema, selanjutny pilih Edit HTML

3. Cari kode seperti dibawah ini

<b:includable id='breadcrumb' var='post'>
<b:loop values='data:posts' var='post'>
<div class='breadcrumbs'>
.............................
.............................
.............................
</div>
</b:loop>
</b:includable>

4. Kemudian ganti dengan kode dibawah ini.

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:view.isPost'>
<b:loop values='data:posts' var='post'>
<div class='breadcrumbs'  >
<span   >
<a expr:href='data:blog.homepageUrl'  title='Home'>
<meta content='1' />
<span ><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></span></a>
</span>
<b:if cond='data:post.labels'>
<b:loop index='nomor' values='data:post.labels' var='label'> &amp;nbsp;&#8250;&amp;nbsp;
     <span   >
<meta expr:content='data:nomor+2' />
<a expr:href='data:label.url + &quot;?&amp;max-results=8&quot;' expr:title='data:label.name'  rel='nofollow'>
<span ><data:label.name/></span>
</a>
</span>
</b:loop>
<b:else/>
&amp;nbsp;&#8250;&amp;nbsp; <span ><data:blog.pageName/></span>
</b:if>
</div>
</b:loop>
<b:elseif cond='data:view.isPage'/>
<div class='breadcrumbs'  >
<span   >
<a expr:href='data:blog.homepageUrl'  title='Home'>
<meta content='1' />
<span ><b:switch var='data:blog.locale'><b:case value='id'/>Beranda<b:default/>Home</b:switch></span></a>
</span> &amp;nbsp;&#8250;&amp;nbsp; 
  <span   >
<meta expr:content='data:num+2' />
<a expr:href='data:blog.url' expr:title='data:post.url' >
<span ><data:blog.pageName/></span>
</a>
</span>
</div>
</b:if>
</b:includable>

5. Atau Dengan Kode Dibawah Ini.

<b:loop values='data:posts' var='post'>
<div class='breadcrumb'  >
<span   >
<a expr:href='data:blog.homepageUrl.canonical' title='Home' >
<meta content='1' />
<span >Home</span></a>
</span>
<b:if cond='data:post.labels'>
<b:loop index='num' values='data:post.labels' var='label'> &amp;nbsp;&#8250;&amp;nbsp;
          <span   >
<meta expr:content='data:num+2' />
<a expr:href='data:label.url.canonical' expr:title='data:label.name' >
<span ><data:label.name/></span>
</a>
</span>
</b:loop>
<b:else/>
&amp;nbsp;&#8250;&amp;nbsp; Tidak Ada Kategori
</b:if>
</div>
</b:loop>

6. Simpan.

Setelah itu silahkan untuk melakukan validasi perbaikan di Google Search Console. Tunggu sampai ada pemberitahuan dari google.

Cara Mengatasi Data-Vocabulary.org Schema Deprecated Menggunakan JSON-LD

Caranya hampir sama dengan penerapan schema dari Microdata HTML, perbedaannya JSON-LD menggunakan Script bukan html lagi. Silahkan masuk ke menu Edit HTML di tema blog kalian

Cari kode dibawah ini

<data:post.body/>

Kemudian letakan kode script dibawah ini dibawah kode diatas tadi

<script type='application/ld+json'>{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "Home",
"item": "<data:blog.homepageUrl.canonical/>"
<b:if cond='!data:post.labels'>}<b:else/>},<b:loop index='i' values='data:post.labels' var='label'>
{
"@type": "ListItem",
"position": <b:with value='data:i + 2' var='num'><b:eval 
expr='data:num'/></b:with>,
"name": "<data:label.name/>",
"item": "<data:label.url.canonical/>"
<b:if cond='data:post.labels.size != data:i + 1'>},<b:else/>}</b:if></b:loop></b:if>
]
}</script>

Kesimpulan Memperbaiki Warning Breadcrumb

Apabila masih menggunakan schema dari vocabulary maka sekarang saatnya beralih menggunakan schema dari schema.org. Untuk pengguna wordpress, tinggal tunggu update dari plugin Yoast SEO.

Alangkah baiknya penerapan Schema Markup Secara Lengkap Di Blog Atau Website. Semoga bermanfaat.