BloggerテーマZELO構造化データテストツールでエラーが出るので修正

このブログは「Blogger」の日本語テンプレート(テーマ)「ZELO」を使用していますが、「構造化データ テストツール」で確認してみるとエラーが出ていました。
早速、修正していこうと思います。


素人なので、構造化データのエラーについて、分かり易く解説してあるブログを探さなければ…

最初に参考にしたのはこちらのブログの記事。

Blogger用テーマ「ZELO」を導入した感想&カスタマイズ - 双極性障害と生きる

構造化データエラーへの対処
ZELOの画面表示は全く問題ないのですが、「構造化データ テストツール」で見てみると、いくつか構造化データのエラーが出てきました。
構造化データエラーがあるとSEO的によろしくないらしい?ということで、対処していきます。

まず、この記事を見て「構造化データ テストツール」なるものの存在を知りました。

しかも、日本語テーマ「ZELO」には、いくつかエラーがある…?

あれこれ調べてみて気づきました。意外と「ZELO」を使用しているブロガーさんが少ない…!

いろいろ検索してみたんですが、そもそも「ZELO」を使用して入るBloggerユーザーさんが、思ってたよりも全然少ない…!

しかも、やっと見つけたと思ったら、すでに「無料版のZELO」から、有料版の「Orange ZELO」や「Prime ZELO」へと変更済だったりして。

あるいは、構造化データがエラーのまま使用してたりして、参考にならないとか…。

結局、ZELOのカスタマイズに関する情報があまり得られませんでした…。

先日、こんな記事を書いたんですが、利用者が想像よりも少なかったです。

Bloggerの日本語テンプレート「ZELO」が理想的でおすすめ

実際にZELOを利用しつつ、構造化データのエラーを修正している人のブログがあんまり見つからない…。

いろいろ彷徨っていてここに辿り着きました。「すたすた式」

[Blogger]ほぼコピペでOK サーチコンソール 構造化データのエラーを消す!JSON-LDでマークアップに挑戦[Search Console] [Vaster 1.9 & 2 ] - すたすた式

詳しいことはよく分かりませんが、今まで調べていた方式とは違い「JSON-LD」という方式によるものらしいです。

正直、初耳です。何が何やらよく分かりません。

とはいえ、ほぼコピペでOKということですので、そっくり参考にさせていただきました。

テーマは「Vaster1.9」あるいは「Vaster2」に関するカスタマイズの記事ですが、おそらく「ZELO」でも、通用するのではないかと。

具体的なエラー修正のためにやること。

やること、その1

まず、HTML編集で、以下のコードを探し出します。
キーボードの「CTRL」+「F」で、「hentry」の文字列を探せば見つかります。

<div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

いろいろ指定されてますが、これを単なる<div>だけに書きかえます。


やること、その2

そして今、単なる<div>に書きかえた部分のすぐ下に、以下のコードをコピペします。
赤い文字「https://◯◯◯◯◯.png」の部分(画像のURL)だけ、各自で自分のブログのロゴに変更すればOK。

<script type="application/ld+json">
{ "@context": "https://schema.org",
"@type": "BlogPosting",
"author": {
 "@type": "Person",
 "name": "<data:post.author/>"
 },
"datePublished": "<data:post.timestampISO8601/>",
"headline": "<data:post.title/>",
"image": {
 "@type": "ImageObject",
 "url" : "<data:post.firstImageUrl/>",
 "width": "",
 "height": ""
 },
"publisher": {
    "@type": "Organization",
    "name": "<data:blog.title />",
    "logo": {
      "@type": "ImageObject",
      "url": "https://◯◯◯◯◯.png",
      "width": "48",
      "height": "48"
    }
  },
"dateModified": "<data:post.lastUpdatedISO8601/>",
"mainEntityOfPage": "<data:blog.url/>"
}
</script>


一応、これで「構造化データ テストツール」でエラーが出なくなりました。

ただ実際のところ、私には何が何だか分かっておりません。

全く意味が分からないまま、コピペしただけですので、そのへんのところは、あらかじめご了承ください。

おまけ

ちなみに、実際には、
<div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
の部分を
<div>
に書きかえただけでも、エラーは出なくなるみたいですね。

詳しいことはよく分かりませんが「hentry」という規格?をを書き込むと、それに対して、いろいろと細かく指定しなければならないらしいです。

このhentyというのは、googleなどの検索エンジンで対応しているいくつかの規格(書き方)の中で、microfomats.orgによる記事に関する宣言みたいなものとなります。(ウェブマスターツールのエラーページの中でそれぞれどの規格か表示されていますね)
他の規格だと若干ややこしい記述をしないといけないんですが、このhentryについてはclass名に一言hentryと入れるだけで簡単にウェブマスターツールに認識しまうので、必須項目がマークアップされていないためエラーを指摘されてしまったわけです。

hentryがらみのエラーをそろそろ消していく - 柴犬使いのSEO対策術式

とりあえず、今日は時間が無いので、このへんにしておきます。
後日、追記や修正があるかも知れません。


0 件のコメント :

コメントを投稿