2 Cara Memasang Schema Org Markup di Blogger dengan 11 Langkah Mudah
Tutorial: Cara Membuat dan Memasang Schema Org Markup di Blogger/Blogspot
Dinamakan, di sebut, atau diistilahkan Microdata Schema Org; yakni sebuah schema markup atau data terstruktur yang di pasang di template blogger, guna memudahkan mesin telusur melakukan indeks terhadap situs web yang kamu miliki.
Sebuah blog, situs, atau website; apabila sudah disematkan (disisipkan/dipasangkan) Microdata Schema Org, maka peringkat artikel dan situsnya akan bagus di Search Engine Result Page (SERP).
Dengan adanya kode Microdata Schema Org yang dipasangkan pun, memudahkan situs web tersebut untuk bisa mengalahkan situs-situs pesaing lainnya.
Guna kelengkapan Content kali ini, coba periksa kembali apakah Microdata Schema Org tidak ada yang error, atau malah ditemukan warning (error).
Pada analisa yang ditampilkan, kamu akan melihat berbagai elemen yang berbeda-beda; dimulai dari Hatom, Author, MainEntityOfPage, dan banyak lagi.
Jika tidak ditemukannya, baik salah satu atau semua elemen yang dimaksud; dipastikan template blogger yang kamu gunakan saat ini tidak terpasang Schema Org Markup.
Sudah terpasang Schema Org Markup tapi salah satu diantaranya error? Silakan baca artikel ini: Tutorial Cara Mengatasi Error di Structured Data Testing Google Microdata (Schema Org).
Di bawah ini kamu akan diberikan tutorial bagaimana cara membuat dan menambahkan kode Schema Org Markup di template blogger dalam beberapa langkah mudah nan praktis.
Ganti kode <nav> dengan kode di bawah ini:
Ganti kode <body> dengan kode di bawah ini:
Ganti kode <header> atau <header-wrapper> dengan kode di bawah ini:
Ganti kode <content-wrapper> atau <main-wrapper> dengan kode di bawah ini:
...atau...
Catatan: Cek kembali template blogger kamu apakah menggunakan atribut "Main" atau "Content". Silakan disesuaikan sendiri.
Ganti kode di bawah ini:
...dengan kode di bawah ini:
Ganti kode di bawah ini:
...dengan kode di bawah ini:
Catatan: Jika tidak ada atribut HTML seperti <article, dipastikan atribut HTML yang digunakan adalah atribut HTML dengan kode <post atau berbeda dari pada itu.
Cari dan ganti kode di bawah ini:
...dengan kode di bawah ini:
Cari kode ini <div id='sidebar-wrapper'> lalu ganti dengan kode di bawah ini:
Ganti kode <footer id='footer-wrapper'> dengan kode di bawah ini:
Ganti kode <div id='footer-credit'> dengan kode di bawah ini:
Artikel ini pada dasarnya terdiri dari 2 tutorial yang berbeda tapi masih dalam satu tujuan, yakni memasang Schema Org Markup di Blogger/Blogspot.
Untuk kamu yang kesulitan dan tidak ingin repot, silakan Copas kode di bawah ini, di bawah kode <body> atau <body :
Note: Ganti kode blog-logo-url-square-size-is-good (warna biru) dengan URL logo blog. Jika tidak ada, bisa dengan cara menggunakan kode favicon seperti URL https://example.blogspot.com/favicon.ico/ atau https://www.example.com/favicon.ico/.
Itulah tutorial tips dan trik bagaimana cara membuat dan memasang Schema Org Markup di Blogger dengan 11 langkah mudah.
Source:
http://www.contohblog.com/2015/12/cara-memasang-schema-org-markup-di-blogger.html
http://www.bloggerspice.com/2015/12/how-to-add-schema-markup-on-your-blogger-template.html
http://www.techprevue.com/schema-org-meta-data-tags-for-blogger-advanced-practices/
Dinamakan, di sebut, atau diistilahkan Microdata Schema Org; yakni sebuah schema markup atau data terstruktur yang di pasang di template blogger, guna memudahkan mesin telusur melakukan indeks terhadap situs web yang kamu miliki.
Sebuah blog, situs, atau website; apabila sudah disematkan (disisipkan/dipasangkan) Microdata Schema Org, maka peringkat artikel dan situsnya akan bagus di Search Engine Result Page (SERP).
 |
| Pic: WP Dev Generated Box |
Dengan adanya kode Microdata Schema Org yang dipasangkan pun, memudahkan situs web tersebut untuk bisa mengalahkan situs-situs pesaing lainnya.
Cara Mengecek Structured Data Testing Tool Google
Guna kelengkapan Content kali ini, coba periksa kembali apakah Microdata Schema Org tidak ada yang error, atau malah ditemukan warning (error).
- Masuk ke Google: Structured Data Testing Tool
- Silakan input URL situs web kamu, termasuk HTTP/HTTPS dan WWW/Non-WWW
- Klik tombol Analisa
Pada analisa yang ditampilkan, kamu akan melihat berbagai elemen yang berbeda-beda; dimulai dari Hatom, Author, MainEntityOfPage, dan banyak lagi.
Jika tidak ditemukannya, baik salah satu atau semua elemen yang dimaksud; dipastikan template blogger yang kamu gunakan saat ini tidak terpasang Schema Org Markup.
Sudah terpasang Schema Org Markup tapi salah satu diantaranya error? Silakan baca artikel ini: Tutorial Cara Mengatasi Error di Structured Data Testing Google Microdata (Schema Org).
2 Cara Memasang Schema Org Markup di Blogger dengan 11 Langkah Mudah
Di bawah ini kamu akan diberikan tutorial bagaimana cara membuat dan menambahkan kode Schema Org Markup di template blogger dalam beberapa langkah mudah nan praktis.
Tutorial pemasangan Schema Org Markup di Blogger Theme ini sedikit rumit, dan menyita waktu. Alih-alih ingin menambahkan kode Schema Org Markup, malah template blog menjadi rusak. Maka dari itu, Back-Up template blogger di Notepad :)
Ganti kode <nav> dengan kode di bawah ini:
<nav id='topnav' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'>
Ganti kode <body> dengan kode di bawah ini:
<body class='index' itemscope='' itemtype='http://schema.org/WebPage'>
Ganti kode <header> atau <header-wrapper> dengan kode di bawah ini:
<div id='header-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPHeader'>
Ganti kode <content-wrapper> atau <main-wrapper> dengan kode di bawah ini:
<div id='content-wrapper' itemscope='itemscope' itemtype='http://schema.org/Blog' role='main'>
...atau...
<div id='main-wrapper' itemscope='itemscope' itemtype='http://schema.org/Blog' role='main'>
Catatan: Cek kembali template blogger kamu apakah menggunakan atribut "Main" atau "Content". Silakan disesuaikan sendiri.
Ganti kode di bawah ini:
<div class='post hentry uncustomized-post-template' >
...dengan kode di bawah ini:
<div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
Ganti kode di bawah ini:
<article class='post hentry' expr:id='data:post.id'>
...dengan kode di bawah ini:
<article class='post hentry' expr:id='data:post.id' itemscope='' itemtype='http://schema.org/BlogPosting'>
Catatan: Jika tidak ada atribut HTML seperti <article, dipastikan atribut HTML yang digunakan adalah atribut HTML dengan kode <post atau berbeda dari pada itu.
Cari dan ganti kode di bawah ini:
<div class='author-profile' itemprop='author' >
...dengan kode di bawah ini:
<span class='fn author' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
Cari kode ini <div id='sidebar-wrapper'> lalu ganti dengan kode di bawah ini:
<div id='sidebar-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPSideBar'>
Ganti kode <footer id='footer-wrapper'> dengan kode di bawah ini:
<footer id='footer-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPFooter'>
Ganti kode <div id='footer-credit'> dengan kode di bawah ini:
<footer id='footer-credit' itemscope='itemscope' itemtype='http://data-vocabulary.org/copyrightHolder'>
Khusus untuk kode <footer id='footer-wrapper'> dan <div id='footer-credit'> yang ada di atas, hati-hati ketika ingin mengimplementasikan Schema Org Markup di template blogger. Mengapa? Sebab kedua atribut HTML itu hampir persis sama, dan kebanyakan template blogger jaman sekarang memiliki atribut HTML yang berbeda-beda antara satu dengan lainnya. Jadi, perhatikan baik-baik.
Artikel ini pada dasarnya terdiri dari 2 tutorial yang berbeda tapi masih dalam satu tujuan, yakni memasang Schema Org Markup di Blogger/Blogspot.
Tutorial No. 2 ini sama saja seperti tutorial No. 1 di atas. Sayangnya, kami tidak merekomendasikannya sama sekali. Baiknya gunakan tutorial No. 1 di atas karena lebih lengkap dan meyakinkan :)
Untuk kamu yang kesulitan dan tidak ingin repot, silakan Copas kode di bawah ini, di bawah kode <body> atau <body :
<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:else/>
<meta content='//blog-logo-url-square-size-is-good' itemprop='image'/>
</b:if>
</div>
<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:else/>
<meta content='//blog-logo-url-square-size-is-good' itemprop='image'/>
</b:if>
</div>
Note: Ganti kode blog-logo-url-square-size-is-good (warna biru) dengan URL logo blog. Jika tidak ada, bisa dengan cara menggunakan kode favicon seperti URL https://example.blogspot.com/favicon.ico/ atau https://www.example.com/favicon.ico/.
Jika boleh menyarankan, alangkah baiknya apabila kamu menggunakan URL logo blog milik kamu sendiri. Jangan pernah menggunakan URL logo blog milik situs web lainnya.
Itulah tutorial tips dan trik bagaimana cara membuat dan memasang Schema Org Markup di Blogger dengan 11 langkah mudah.
Source:
http://www.contohblog.com/2015/12/cara-memasang-schema-org-markup-di-blogger.html
http://www.bloggerspice.com/2015/12/how-to-add-schema-markup-on-your-blogger-template.html
http://www.techprevue.com/schema-org-meta-data-tags-for-blogger-advanced-practices/
Labels: Tutorial Blogger
Thanks for reading 2 Cara Memasang Schema Org Markup di Blogger dengan 11 Langkah Mudah. Please share this article.
0 Response to "2 Cara Memasang Schema Org Markup di Blogger dengan 11 Langkah Mudah"
Post a Comment
Punya masalah? Hubungi kami di Pemecah Masalah.
Silakan bertanya secara spesifik agar kami mudah dalam menjawabnya :)