Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / Tips SEO

Cara Memasang Microdata Schema Org di Template Blogger untuk SEO

Posting Komentar
Cara Memasang Microdata Schema Org di Template Blogger/Blogspot untuk SEO

 SEBELUMNYA CB sudah share tentang Cara Memasang Micro Data Schema Markup di Template Blogger dengan cara simple dan cepat, yaitu dengan memasukkan kumpulan aba-aba standar Schema Org untuk Blogger.

CB juga sudah share cara mengatasi semua error structured data dikala dites di Webmaster Google.

Kali ini CB share cara memasang microdata schema markup di template blogger per elemen, atau di semua bab template. Posting ini juga sekalian buat dokumentasi langsung semoga lebih mudah diakses.

Elemen Utama / Divisi Template Blogger: 

  • Body
  • Header
  • Menu
  • Content
  • Sidebar
  • Footer.
elemen desain template blogger website


Apa itu Schema Org atau Schema Markup?

Schema Org atau Schema Markup yakni rangkaian aba-aba untuk memudahkan mesin pencari --terutama Google, Yahoo, dan Bing-- menemukan dan mengindeks blog atau postingan blog kita.

Microdata Schema Org di Template Blogger untuk SEO


Template-template terbaru biasanya sudah dilengkapi schema org atau microdata ini. Namun, kalau belum ada --cek dulu di Structured Data Testing Tools, maka Anda lengkap saja dengan cara di bawah ini.

Structured Data Testing Tools

Cara Memasang Struktur Schema Microdata di Blogger/Blogspot

1. Template -> Edit HTML
2. Ganti aba-aba <nav> atau aba-aba navigasi menu blogger Anda dengan aba-aba berikut ini:

<nav id='topnav' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'> 

3. Ganti aba-aba <body> dengan aba-aba ini:

<body class='index' itemscope='' itemtype='http://schema.org/WebPage'> 

4. Ganti aba-aba <header> atau <header-wrapper> dengan:

<div id='header-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPHeader'>

5. Ganti aba-aba <content-wrapper> atau <main-wrapper> dengan:

<div id='content-wrapper' itemscope='itemscope' itemtype='http://schema.org/Blog' role='main'> 

6. Ganti aba-aba <div class='post hentry uncustomized-post-template' > dengan:

<div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

7. Ganti aba-aba <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 aba-aba <div class='author-profile' itemprop='author' > dengan:

<span class='fn author' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>

9. Ganti aba-aba <div id='sidebar-wrapper'> dengan kode:

<div id='sidebar-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPSideBar'> 

10. Ganti aba-aba <footer id='footer-wrapper'> dengan:

<footer id='footer-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPFooter'>

11. Ganti aba-aba <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 alasannya aba-aba 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 menyerupai CB cantumkan linknya di awal postingan ini.

Tapi, setuju CB ulang saja aba-aba dan cara pasangnya berikut ini

1. Tema/Template > Edit HTML
2. Copas aba-aba berikut ini di bawah aba-aba <body> atau <body expr:class=’&quot;loading&quot; + data:blog.mobileClass’>

<div itemscope='itemscope' itemtype='http://schema.org/Blog' style='display: none;'>
<b:if cond='data:blog.pageType != &quot;index&quot;'>
<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 mampu 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!

Referensi 
https://blog.kissmetrics.com/get-started-using-schema/


Posting Komentar untuk "Cara Memasang Microdata Schema Org di Template Blogger untuk SEO"