Cara Memasang Microdata Schema Org di Template Blogger untuk SEO
July 28, 2017
SEBELUMNYA CB sudah share tentang Cara Memasang Micro Data Schema Markup di Template Blogger dengan cara simple dan cepat, yaitu dengan memasukkan kumpulan kode standar Schema Org untuk Blogger.
CB juga sudah share cara mengatasi semua error structured data saat dites di Webmaster Google.
Kali ini CB share cara memasang microdata schema markup di template blogger per elemen, atau di semua bagian template. Posting ini juga sekalian buat dokumentasi pribadi biar lebih mudah diakses.
Elemen Utama / Divisi Template Blogger:
- Body
- Header
- Menu
- Content
- Sidebar
- Footer.
Apa itu Schema Org atau Schema Markup?
Schema Org atau Schema Markup adalah rangkaian kode untuk memudahkan mesin pencari --terutama Google, Yahoo, dan Bing-- menemukan dan mengindeks blog atau postingan blog kita.
Template-template terbaru biasanya sudah dilengkapi schema org atau microdata ini. Namun, jika belum ada --cek dulu di Structured Data Testing Tools, maka Anda lengkap saja dengan cara di bawah ini.
2. Ganti kode <nav> atau kode navigasi menu blogger Anda dengan kode berikut ini:
3. Ganti kode <body> dengan kode ini:
4. Ganti kode <header> atau <header-wrapper> dengan:
5. Ganti kode <content-wrapper> atau <main-wrapper> dengan:
6. Ganti kode <div class='post hentry uncustomized-post-template' > dengan:
7. Ganti kode <article class='post hentry' expr:id='data:post.id'> dengan:
8. Cari dan ganti kode <div class='author-profile' itemprop='author' > dengan:
9. Ganti kode <div id='sidebar-wrapper'> dengan kode:
10. Ganti kode <footer id='footer-wrapper'> dengan:
11. Ganti kode <div id='credit'> dengan kode:
12. Save!
NOTE
Jika setelah kode-kode di atas dipasangkan terjadi error, terutama karena kode no. 6 dan 7, maka lakukan perbaikannya di Cara Mengatasi Semua Error Structured Data.
Tapi, baiklah CB ulang saja kode dan cara pasangnya berikut ini
1. Tema/Template > Edit HTML
2. Copas kode berikut ini di bawah kode <body> atau <body expr:class=’"loading" + data:blog.mobileClass’>
Kode Alternatif
Kode berikut ini juga bisa digunakan, namun dipasangnya di bawah kode <b:includable id='post' var='post'>
Demikian Cara Memasang Struktur Microdata Schema Org di Template Blogger/Blogspot untuk SEO. Good Luck & Happy Blogging! (www.contohblog.com).*
Referensi
https://blog.kissmetrics.com/get-started-using-schema/
http://www.bloggerspice.com/2015/12/how-to-add-schema-markup-on-your-blogger-template.html
Template-template terbaru biasanya sudah dilengkapi schema org atau microdata ini. Namun, jika belum ada --cek dulu di Structured Data Testing Tools, maka Anda lengkap saja dengan cara di bawah ini.
Cara Memasang Struktur Schema Microdata di Blogger/Blogspot
1. Template -> Edit HTML2. Ganti kode <nav> atau kode navigasi menu blogger Anda dengan kode berikut ini:
<nav id='topnav' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'>
3. Ganti kode <body> dengan kode ini:
<body class='index' itemscope='' itemtype='http://schema.org/WebPage'>
4. Ganti kode <header> atau <header-wrapper> dengan:
<div id='header-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPHeader'>
5. Ganti kode <content-wrapper> atau <main-wrapper> dengan:
<div id='content-wrapper' itemscope='itemscope' itemtype='http://schema.org/Blog' role='main'>
6. Ganti kode <div class='post hentry uncustomized-post-template' > dengan:
<div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
7. Ganti kode <article class='post hentry' expr:id='data:post.id'> dengan:
<article class='post hentry' expr:id='data:post.id' itemscope='' itemtype='http://schema.org/BlogPosting'>
8. Cari dan ganti kode <div class='author-profile' itemprop='author' > dengan:
<span class='fn author' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
9. Ganti kode <div id='sidebar-wrapper'> dengan kode:
<div id='sidebar-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPSideBar'>
10. Ganti kode <footer id='footer-wrapper'> dengan:
<footer id='footer-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPFooter'>
11. Ganti kode <div id='credit'> dengan kode:
<div id='credit' itemscope='itemscope' itemtype='http://data-vocabulary.org/copyrightHolder'>
12. Save!
NOTE
Jika setelah kode-kode di atas dipasangkan terjadi error, terutama karena kode no. 6 dan 7, maka lakukan perbaikannya di Cara Mengatasi Semua Error Structured Data.
Cara Gampang Memasang Struktur Microdata Schema untuk Pemula
Bagi Blogger pemula, cara di atas tentunya sangat ribet. Maka, CB sarankan gunakan cara mudah seperti CB cantumkan linknya di awal postingan ini.Tapi, baiklah CB ulang saja kode dan cara pasangnya berikut ini
1. Tema/Template > Edit HTML
2. Copas kode berikut ini di bawah kode <body> atau <body expr:class=’"loading" + data:blog.mobileClass’>
<div itemscope='itemscope' itemtype='http://schema.org/Blog' style='display: none;'>
<b:if cond='data:blog.pageType != "index"'>
<meta expr:content='data:blog.pageName' itemprop='name'/>
<meta expr:content='data:blog.canonicalUrl' itemprop='url'/>
<b:else/>
<meta expr:content='data:blog.title' itemprop='name'/>
<meta expr:content='data:blog.homepageUrl' itemprop='url'/>
</b:if> <meta expr:content='data:blog.metaDescription' itemprop='description'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' itemprop='image'/>
</b:if>
</div>
Kode Alternatif
Kode berikut ini juga bisa digunakan, namun dipasangnya di bawah kode <b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template' itemscope='' itemtype='http://schema.org/Blog' property='blogpost' style='display:none;'>
<div expr:content='data:post.title' itemprop='name alternateName'/>
<div expr:content='data:post.url' itemprop='url'/>
<div expr:content='data:blog.homepageUrl' itemprop='additionalType'/>
<div expr:content='data:post.thumbnailUrl' itemprop='image thumbnailUrl'/>
<span itemprop='description'><data:post.body/></span>
<span itemprop='author editor'><data:post.author/></span>
<span itemprop='datePublished dateCreated'><data:post.timestamp/></span>
<span itemprop='version'>CB Blogger</span>
<span itemprop='contentLocation'>Indonesia</span></div>
Demikian Cara Memasang Struktur Microdata Schema Org di Template Blogger/Blogspot untuk SEO. Good Luck & Happy Blogging! (www.contohblog.com).*
Referensi
https://blog.kissmetrics.com/get-started-using-schema/
http://www.bloggerspice.com/2015/12/how-to-add-schema-markup-on-your-blogger-template.html
Previous
« Prev Post
« Prev Post
Next
Next Post »
Next Post »
CB Blogger
Min, kalau saya pakai cara yang perelemen dan cara gampang yang alternatif diatas nggak masalah kan bagi blog dan seo ? mohon tanggapannya. Terima kasih
ReplyDeleteNggak masalah....
Deletetinggal satu lg yg datePublished & dateModified, saya mau pasang tp ragu takutnya tanggal jadi muncul di hasil pencarian. sdgkan sy sengaja umpetin tanggal krna bukan konten berita..
ReplyDeleteampuun
ReplyDelete