Cara membuat dan mengatasi error breadcrumb di search console
Cara membuat dan mengatasi error breadcrumb di search console untuk blogger
Kali ini sound on Mike akan memberikan tips bagaimana membuat dan mengatasi eror Breadcrumb disearch console. Mengapa error? Hal ini dikarenakan google tak lagi mensupport markup yang berasal dari situs data-vocabulary,dan sekarang digantikan sepenuhnya oleh situs schema.
Nah,karena Breadcrumb merupakan bentuk navigasi wajib buat kalian yang ingin mendaftarkan blog kalian di adsense maka saya akan berusaha membuatnya semudah mungkin,agar kalian dapat menerapkannya diblog kalian.
Apa itu Breadcrumb?
Sebelumnya,kita pasti bertanya tanya,apasih breadcrum itu? Breadrumb adalah bentuk navigasi link yang bertingkat berdasarkan hirarki file yang ada disebuah web berdasarkan label atau kategori postingan yang dimiliki. Hirarki ini mirip dengan bentuk folder yang ada distorage handphone kita lho...karena web merupakan sebuah direktori yang memuat berbagai file artikel,maka dibutuhkan breadcrum untuk memberikan navigasi buat penggunanya. Hirarkinya bisa kita liat pada archive yang ada diblog seperti gambar berikutMeskipun diatas dipilah melalui tanggal terbit Breadcrumb akan memilahnya kembali menjadi kategori dan label yang sesuai. Dan tampilannya akan seperti gambar dibawah ini
Cara menambahkan Breadcrumb diblogger
Setelah kita tau apa itu breadcrumb,mari kita membuatnya diblog kita dengan cara sebagai berikut. Untuk versi PC Buka dashbord blogger kalian, kemudian pilih Tema > edit html kemudian cari kode berikut dengan menekan ctrl+f
Lalu tambahkan kode berikut tepat diatas kode yang kita cari tadi
<b:includable id='comment-form' var='post'>
Lalu tambahkan kode berikut tepat diatas kode yang kita cari tadi
<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 expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
<span itemprop='name'>Home</span>»</a>
<meta content='1' itemprop='position'/>
</span>
<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"'>
</b:if>
</b:loop>
<span><data:post.title/></span>
</div>
</b:if>
</b:loop>
</b:if>
</b:includable>
<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 expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
<span itemprop='name'>Home</span>»</a>
<meta content='1' itemprop='position'/>
</span>
<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"'>
</b:if>
</b:loop>
<span><data:post.title/></span>
</div>
</b:if>
</b:loop>
</b:if>
</b:includable>
Kemudian cari kode berikut :
<b:includable id='main' var='top'>
Tambahkan kode berikut tepat dibawahnya
<b:include data='posts' name='breadcrumb'/>
Nah silahkan validasi url artikel anda di Alat penguji struktur data . Jika tak ada peringatan itu tandanya validasi anda berhasil. Selamat mencoba...
Eh kok saya nyasar dimari yak :v.
ReplyDeleteKalo saya ada breadcrumbs nya ndak yah, kok yg diatas judul di blog saya mirip breadcrumbs, tp kok ndak dapet notif error breadcrumb, ahh sudahlah saya lagi ngelu edit2 template wkwkwkwkwk
Wkwkwk...breadcrumbs sampean keren mas....simple dan mungkin valid makanya gak dpt motif eror😉
DeleteWkwkwkwk wah gitu ya kang, tak cek di jigsaw juga ndak enek error sih, cuma masih ada problem gambar artikel gak pas di tengah :v.
DeleteWalaupun pas diedit postingan buat pic pilih posisi "center"?
DeleteEnggih mas. Saya cek2 trnyata kode nya saya ndak ada kode css display:block , makanya nempel di kanan mulu. Skrng dsh fix di tengah allhamdulillah.
DeleteAlhamdulillah yah....😁(kok kaya ngartis yg cetar membahana itu yak😂)
DeleteIya nih allhamdulillah sesuatu cetar membahana wkwkwkwk
DeleteHai mas fandhy, sombong dirimu gak pernah menyapa aku hee
ReplyDeleteHalo deni, halo halo haloo... nah tuh ane safa hhhh
DeleteTutorialnya membantu banget bang mike. Mesti waras sama masalah teknis begini.Biasanya suka dilupain.
ReplyDeleteMakasih sudah mau mampir mbak....semoga blognya makin maju😉
Delete