Valid Json-LD isPartOf Yoast SEO Untuk Blogger (Blogspot)

AndroLite
AndroLite.com : Custom Json-LD isPartOf Yoast Untuk Blogger (Blogspot) Terbaru 2024 - SEO (Search Engine Optimization) merupakan salah satu unsur penting dalam membangun dan mengembangkan sebuah Blog atau Website. Penerapan SEO yang baik, akan mampu menempatkan blog pada peringkat terbaik di mesin pencari, seperti Google.com, Bing.com dan sebagainya.

Sekarang ini ada berbagai macam metode Optimasi Mesin Pencari yang bisa diterapkan, termasuk salah satunya menggunakan Struktur data Schema.org yang valid. Dalam hal ini ada tiga opsi yang ditawarkan, yaitu menggunakan format microdata, RDFa dan JSON-LD. Format microdata dan RDFa dapat diterapkan dengan memasukkan markup tertentu satu persatu ke dalam HTML.

Tetapi lain halnya dengan Json-LD, dimana untuk memasangnya ke sebuah website, dapat dilakukan dengan mudah, cepat dan tidak ribet. Yaitu cukup menempelkan script json ke dalam template. Selain itu, Google sendiri lebih merekomendasikan penggunaan markup Json ketimbang format lainnya karena lebih mudah dicrawl dan dipahami oleh robot mesin pencari.

Json-LD sendiri terbagi ke dalam beberapa tipe, diantaranya Article, ArticleNews, BlogPosting, Breadcrumb, BreadcrumbList, Website, Webpage dan masih banyak lagi. Tetapi bagaimana jika beberapa tipe tersebut digabungkan dalam satu script? Jawabannya bisa, yaitu dengan menerapkan Json isPartOf.
Baca juga: Cara Mudah Salin File HP Android ke PC Tanpa Kabel USB
JSON isPartOf merupakan format turunan dengan menggabungkan beberapa schema markup menjadi satu bagian (tidak terpisah) untuk mengatur dan memetakan konten situs. Contohnya markup Article, turunan (is part of) dari Website - Webpage - BreadcrumbList dan seterusnya. Contoh validnya, bisa dilihat DISINI atau gambar berikut.

Schema.org Json-LD isPartOf Blogger

Belakangan ini, markup struktur data isPartOf sudah mulai banyak digunakan dan telah menjadi populer, terutama di kalangan pengguna CMS Wordpress. Markup ini kian makin populer setelah Yoast SEO dengan menambahkannya ke dalam plugin mereka.

Lalu bagaimana dengan pengguna blogger? Nah khusus pengguna blogger, schema markup isPartOf ini juga bisa diterapkan di blog dengan tetap mendasari schema isPartOf umumnya. Berikut script dan cara memasukkannya ke dalam template.

JSON-LD isPartOf Blogger (untuk Posting Blog)

Untuk memudahkan pemasangan, silahkan cari di dalam template markup <b:includable id='postMeta' var='post'> ... </b:includable> kemudian ganti dengan yang berikut ini.
<b:includable id='postMeta' var='post'>
<b:if cond='data:view.isSingleItem'>
<script type='application/ld+json'>
{"@context":"https://schema.org",
"@graph":[{"@type":"Organization",
"@id":"<data:blog.canonicalHomepageUrl/>#organization",
"name":"<data:blog.title/>",
"url":"<data:blog.canonicalHomepageUrl/>",
"sameAs":[ "https://www.facebook.com/username",
"https://www.youtube.com/username",
"https://twitter.com/username",
"https://github.com/username",
"https://pinterest.com/username/",
"https://www.instagram.com/username"], "logo":{"@type":"ImageObject",
"@id":"<data:blog.canonicalHomepageUrl/>#logo",
"url":"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBPB-HZAhfDPclgD52PBAje8lks6DXj-b9Yv9gAu6DGbN8qohxmcIwepw52RkgAFda3BSYcaKx4XNv2b4DErhp1tff-2HBXEcPSJr7A30TddD1KK6G3h-RX2D-ENR8JOldiBFE_qqOPI6/s1600/icon.png",
"width": 512, "height": 512,
"caption":"<data:blog.title/>"},"image":{"@id":"<data:blog.canonicalHomepageUrl/>#logo"},"legalName":"<data:blog.title/>"},{"@type":"WebSite",
"@id":"<data:blog.canonicalHomepageUrl/>#website",
"url":"<data:blog.canonicalHomepageUrl/>",
"name":"<data:blog.title/>",
"inLanguage":"id-ID",
"description":"<data:this.description/>",
"publisher":{"@id":"<data:blog.canonicalHomepageUrl/>#organization"},"potentialAction":{"@type":"SearchAction",
"target":"<data:blog.canonicalHomepageUrl/>search?q={search_term_string}",
"query-input":"required name=search_term_string"}},{"@type":"ImageObject",
"@id":"<data:post.url.canonical/>#primaryimage",
"url":"<b:eval expr='(data:post.featuredImage ? resizeImage(data:post.featuredImage, 700, "700:366") : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkt3cHgGMcaT6cOjtyCZuixkFDVUIQpKjvkT2cabUDX6sFCkjW5lf-phSRR3iI2PnCtwDgD2Meh8Bf6eRoOs8jn0wsO4m5q9u1zzxikw4En7idiV5TR6FFhsVHyc1XaZKvXv5kNmmgrpXg/s1600/detro-default-image.png").jsonEscaped'/>",
"width": 700, "height": 366, "caption":"<data:post.title/>"},{"@type":["WebPage"], "@id":"<data:post.url.canonical/>#webpage",
"url":"<data:post.url.canonical/>",
"name":"<data:post.title/> - <data:blog.title/>",
"isPartOf":{"@id":"<data:blog.canonicalHomepageUrl/>#website"},"inLanguage":"id-ID",
"primaryImageOfPage":{"@id":"<data:post.url.canonical/>#primaryimage"},"datePublished":"<data:post.date.iso8601/>",
"dateModified":"<data:post.lastUpdated.iso8601/>",
"description":"<b:eval expr='data:blog.metaDescription.escaped ? data:blog.metaDescription.escaped : data:this.description'/>",
"breadcrumb":{"@id":"<data:post.url.canonical/>#breadcrumb"}},{"@type":"BreadcrumbList",
"@id":"<data:post.url.canonical/>#breadcrumb",
"itemListElement":[{"@type":"ListItem",
"position": 1, "item":{"@type":"WebPage",
"@id":"<data:blog.canonicalHomepageUrl/>",
"url":"<data:blog.canonicalHomepageUrl/>",
"name":"Home"}},{"@type":"ListItem",
"position": 2, "item":{"@type":"WebPage",
"@id":"<b:if cond='data:post.labels'><b:loop index='num' values='data:post.labels' var='label'><b:if cond='data:num == (data:post.labels.size - 1)'><data:label.url.canonical/></b:if></b:loop></b:if>",
"url":"<b:if cond='data:post.labels'><b:loop index='num' values='data:post.labels' var='label'><b:if cond='data:num == (data:post.labels.size - 1)'><data:label.url.canonical/></b:if></b:loop></b:if>",
"name":"<b:if cond='data:post.labels'><b:loop index='num' values='data:post.labels' var='label'><b:if cond='data:num == (data:post.labels.size - 1)'><data:label.name/></b:if></b:loop></b:if>"}},{"@type":"ListItem",
"position": 3, "item":{"@type":"WebPage",
"@id":"<data:post.url.canonical/>",
"url":"<data:post.url.canonical/>",
"name":"<data:post.title/>"}}]},{"@type":"Article",
"@id":"<data:post.url.canonical/>#article",
"isPartOf":{"@id":"<data:post.url.canonical/>#webpage"},"author":{"@id":"<data:post.author.profileUrl/>"},"headline":"<data:post.title/>",
"datePublished":"<data:post.date.iso8601/>",
"dateModified":"<data:post.lastUpdated.iso8601/>",
"mainEntityOfPage":{"@id":"<data:post.url.canonical/>#webpage"},"publisher":{"@id":"<data:blog.canonicalHomepageUrl/>#organization"},"image":{"@id":"<data:post.url.canonical/>#primaryimage"},"keywords":"<data:post.title/>",
"articleSection":"<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><data:label.name/>, </b:loop></b:if>",
"inLanguage":"id-ID"},{"@type":["Person"], "@id":"<data:post.author.profileUrl/>",
"name":"<data:post.author.name.jsonEscaped/>",
"image":{"@type":"ImageObject",
"@id":"<data:blog.canonicalHomepageUrl/>#authorlogo",
"url":"<b:with value='data:post.author.authorPhoto.image ? resizeImage(data:post.author.authorPhoto.image, 50, "1:1") : resizeImage(data:post.featuredImage, 50, "1:1")' var='image'><data:image/></b:with>",
"caption":"<data:post.author.name.jsonEscaped/>"},"sameAs":[ "https://www.facebook.com/username",
"https://www.youtube.com/username",
"https://twitter.com/username",
"https://github.com/username",
"https://pinterest.com/username/",
"https://www.instagram.com/username"]}]}</script>
</b:if>
</b:includable>
Silahakan edit beberapa bagian yang telah diberikan tanda di dalam kode tersebut. Seperti mengganti Username sosial media, mengganti url logo utama website, url gambar pengganti bila postingan tidak memiliki gambar dan sebagainya.
Struktur data JsonLD untuk halaman / postingan tersebut di atas, berfungsi dengan baik untuk Blogger Layout Versi 3. Sementara untuk versi 1 dan 2 hingga saat ini belum pernah saya coba.
Sekarang, penempatan kode pemanggil agar mesin blogger bisa merendernya. Untuk kode pemanggilnya adalah sebagai berikut.
<b:include data='post' name='postMeta'/>
Nah untuk menempatkan markup pemanggil tersebut, dalam hal ini ada beberapa tempat yang bisa kalian pilih.
  1. Pertama, sesudah markup <b:includable id='post' var='post'>
  2. Kedua, sesudah markup <b:loop values='data:posts' var='post'>
  3. Ketiga sebelum atau sesudah markup <data:post.body/>

JsonLD isPartOf WebPage (Untuk Home Page, Label, dll)

Lantas bagaimana dengan untuk halaman depan (HomePage), label dan sebagainya? Nah dalam hal ini untuk saya pribadi, menggunakan JsonLD WebPage. Kode lengkapnya bisa kalian lihat berikut ini.
<b:if cond='data:view.isMultipleItems'>
<script type='application/ld+json'>
{"@context":"https://schema.org",
"@graph":[
{"@type":"Organization",
"@id":"<data:blog.canonicalHomepageUrl/>#organization",
"name":"<data:blog.title/>",
"url":"<data:blog.canonicalHomepageUrl/>",
"address": {"@type": "PostalAddress",
"addressLocality": "Jakarta, Jakarta Barat, Indonesia",
"streetAddress": "Jalan Yos Sudarso No.5, Jakarta, Jakarta Barat Pos 91511" },
"email": "your@gmail.com",
"telephone": "+6282xxxxxxxx",
"sameAs":["https://www.facebook.com/username",
"https://www.instagram.com/username",
"https://www.youtube.com/username",
"https://pinterest.com/username",
"https://twitter.com/username"],
"logo":{"@type":"ImageObject",
"@id":"<data:blog.canonicalHomepageUrl/>#logo",
"url":"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_3lsh_vF2ziGPvqjpBbD6nn1XQD1_F-Rxau83Ki4I0_0zpaTd2fhRaYlyK14o08d-MpiEbBMuekKWvjH8oq35P_p89pCD2pQDGva-SRH1jfbU_HcyKLU3954vhViDNpbUrIkO1VOXD7uk/s1600/detro.png",
"width":512,
"height":512,
"caption":"<data:blog.title/>"},
"image":{"@id":"<data:blog.canonicalHomepageUrl/>#logo"}},
{"@type":"WebSite",
"@id":"<data:blog.canonicalHomepageUrl/>#website",
"url":"<data:blog.canonicalHomepageUrl/>",
"name":"<data:blog.title/>",
"description":"<data:blog.metaDescription.escaped/>",
"publisher":{"@id":"<data:blog.canonicalHomepageUrl/>#organization"},
"potentialAction":{"@type":"SearchAction",
"target":"<data:blog.canonicalHomepageUrl/>search?q={search_term_string}",
"query-input":"required name=search_term_string"}},
{"@type":"WebPage",
"@id":"<data:blog.canonicalHomepageUrl/>#webpage",
"url":"<data:blog.canonicalHomepageUrl/>",
"inLanguage":"id-ID",
"name":"<data:blog.title/>",
"isPartOf":{"@id":"<data:blog.canonicalHomepageUrl/>#website"},
"about":{"@id":"<data:blog.canonicalHomepageUrl/>#organization"},
"description":"<data:blog.metaDescription.escaped/>"}]}
</script>
</b:if>
Untuk menempatkannya, bisa langsung sebelum tag penutup </head> atau &lt;/head&gt;&lt;!--<head/>--&gt;

Untuk melihat hasilnya apakah valid atau tidak, silahkan cek di Structured Data Testing Tool Google.
Baca juga: Cara Membuat Huruf Tebal, Miring, Coret di Whatsapp

Kelebihan dan Kekurangan Json-LD isPartOf Blogger

Seperti yang telah dikemukakan di atas, markup struktur data Json-LD selain direkomendasikan Google, juga memiliki kelebihan lain dibandingkan format lainnya. Diantaranya:
  1. All in one.
  2. Lebih SEO Friendly.
  3. Mudah dan cepat diterapkan.
  4. Mudah dipahami oleh robot mesin pencari.
  5. Valid HTML 5.
  6. Dapat meningkatkan trafik organik dari mesin pencari.
  7. Dan sebagainya.

Satu-satunya kekurangan yang dimiliki oleh script isPartOf untuk halaman posting ini adalah tidak bisa disisipkan diantara tag <head> ... </head> dan harus ditempatkan di dalam tag <body> ... </body>. Atau lebih tepatnya diantara tag <b:section class='main' id='main' preferred='yes' showaddelement='no'> ... </b:section>.

Hal ini disebabkan oleh mesin blogger yang tidak bisa merender beberapa tag  yang terdapat di dalam script json. Jadi pastikan ketika kalian menempatkannya diantara tag yang telah disebutkan di atas.

Bagaimana? Script Json-LD isPartOf Yoast SEO Untuk Blogger ini lebih mudah diterapkan bukan? Selamat mencoba dan semoga pengunjung blog kalian bisa lebih meningkat. Terima kasih telah berkunjung, salam satu CMS!

Related Post

Open Comment