Bloggerで構造化データのエラーが出てたのでschema.orgでマークアップしてみた

このブログにおいて、「Search Console」にて「構造化データテストツール」にて確認を行ったところエラーが出たので対処してみました。

参考にしたページ

bloggerでの「構造化データ」エラー解決法【参考サイト一覧】

author name

下記コードを検索する。

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

この下に下記コードを追加する。

<span class='vcard' itemprop='author' itemscope='itemscope' itemtype='https://schema.org/Person'>
<span class='fn' itemprop='name' style='display:none;'>（自分の名前ｅｔｃ．）</span></span>

image_url

下記コードを検索する。

<meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>

「image_url」を「image」に変更する。
変更したコードの上下にコードを追加し、下記のようにする。

<b:if cond='data:post.firstImageUrl'>
<span itemprop='image' itemscope='itemscope' itemtype='https://schema.org/ImageObject'>
<meta expr:content='data:post.firstImageUrl' itemprop='image'/>
<span itemprop='height' style='display:none;'>（画像の高さ）</span>
<span itemprop='width' style='display:none;'>（画像の幅）</span>
<span itemprop='url' style='display:none;'> <data:post.firstImageUrl/></span>
</span>             
</b:if>

datePublished update

下記コードを検索する。

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

この下に下記コードを追加する。

<span class='published updated' itemprop='datePublished' style='display:none;'><data:post.timestampISO8601/></span>

headline

下記コードを検索する。

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

この下に以下のコードを追加する。（投稿ページとその他のページで違う値にしている）

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <span itemprop='headline' style='display:none;'><data:blog.pageName/> | <data:blog.title/></span>
<b:else/>
  <span itemprop='headline' style='display:none;'><data:blog.pageTitle/></span>
</b:if>

publisher

下記コードを検索する。

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

この下に以下のコードを追加する。

<span itemprop='publisher' itemscope='itemscope' itemtype='https://schema.org/Organization'>
<span itemprop='logo' itemscope='itemscope' itemtype='https://schema.org/ImageObject'>
<span itemprop='url' style='display:none;'>（ロゴのURL）
</span></span>
<span itemprop='name' style='display:none;'>
（自分の名前ｅｔｃ．）</span></span>

dataModified

下記コードを検索する。

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

この下に以下のコードを追加する。

<span class='updated' itemprop='dateModified' style='display:none;'><data:post.lastUpdatedISO8601/></span>

mainEntityOfPage

下記コードを検索する。

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

この下に以下のコードを追加する。

<meta itemscope='itemscope' itemprop='mainEntityOfPage' itemType='https://schema.org/WebPage' expr:itemid='data:post.link ? data:post.link : data:post.url'/>

以上、参考にしていただけたら幸いです。