Breadcrumb merupakan sebuah navigasi yang merujuk ke halaman artikel. Atau lebih mudahnya bisa dikatakan, halaman artikel tersebut bisa ditemukan dalam kategori apa.
Jadi mesin pencari menggunakan markup breadcrumb untuk mengkategorikan informasi dari halaman ke dalam hasil pencarian.
Kategori atau bisa juga disebut "Label" dalam istilah Blogger. Fitur label ini hanya tersedia pada halaman postingan.
Breadcrumb nantinya digunakan mesin pencari google untuk mengganti teks alamat url halaman dengan label pada markup breadcrumb.
Lihat pada gambar, di bawah judul seharusnya berisi teks url tapi karena halaman terdapat markup breadcrumb maka berubah menjadi navigasi.
Update Error data-vocabulary.org!
Baru baru ini januari 2020 Google secara resmi tidak lagi mendukung skema data-vocabulary.org. Bagi masih menggunakan skema tersebut, Google menghimbau untuk segera beralih ke Schema.org. Jika tidak nanti Webmaster atau Google Search Console akan menampilkan error "data-vocabulary.org schema deprecated" atau "skema data-vocabulary.org sudah usang".
Cara Membuat Breadcrumb dengan Schema.org JSON-LD
Banyak artikel atau postingan yang memberikan tutorial membuat breadcrumb dan telah disertai dengan Schema.org. Cara penempatan markup ini menggunakan format Microdata, atau ada juga yang RDFa.
Akan tetapi markup dengan format JSON-LD lebih disukai oleh mesin pencari, sehingga ini lebih direkomendasikan untuk digunakan. Itu karena pembacaan script JSON-LD lebih mudah.
Dalam pengalaman saya menggunakan 3 jenis format (Microdata, RDFa, dan JSON-LD) pada breadcrumb, yang berhasil (SEO Friendly) di google dekstop dan mobile hanya format JSON-LD. Berhasilnya yaitu teks alamat url berganti menjadi navigasi, seperti pada gambar di atas.
Ini juga bisa sebagai alternaltif bagi yang ingin tidak menggunakan navigasi breadcrumb di halaman postingan.
Memasang Schema Breadcrumb Script JSON-LD
Pertama Copy code berikut.
<b:if cond='data:view.isPost'><!--mankoin.com--><script type='application/ld+json'>{ "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "item": { "@id": "<data:blog.homepageUrl/>", "name": "<data:blog.title/>" } }<b:loop index='i' values='data:post.labels' var='label'>,{ "@type": "ListItem", "position": <b:eval expr='data:i + 2'/>, "item": { "@id": "<data:label.url/>", "name": "<data:label.name/>" } }</b:loop>]}</script></b:if>Kemudian cari kode <b:includable id='post' var='post'> di widget Blog, setelah ketemu pastekan setelah kode tersebut.
Sekarang Schema Breadcrumb dengan script JSON-LD sudah dibuat. Jika di blog sudah terpasang Breadcrumb yang lama, lebih baik dibuang saja (dihapus), jika tidak maka hapus schemanya saja. Caranya cari dan hapus atribut itemscope, itemtype, dan itemprop pada elemen navigasi breadcrumb. Karena kemungkinan nanti bisa terjadi bentrok. Sebagai Contoh:
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
Jika dihapus skemanya menjadi.
<span>
Dan yang terakhir cek validasi menggunakan struktured data testing tool google.
ada cara agar work jika script JSON-LD di pasang di bawah tag head mas ?
BalasHapusJika di pasang di tag head tidak bisa mas, kecuali jika memakai trik. Note: Di pasang pada tag body tidak menimbulkan masalah.
Hapus