Blogger・schema.orgのシンプルなパンくずリストにする方法

パンくずリストのマークアップで「 data-vocabulary.org 」が使用されている場合は、2020年 4月 6日以降 Google のサポート外となるため、検索結果にパンくずリストが反映されなくなります。反映させるには、「 schema.org 」でマークアップしたものに変更しなければなりません。
テーマ「シンプル」などのウィジェットバージョンが「 1 」のテンプレートであれば、下記の「 schema.org 」でマークアップしたものが使用できます。

Blogger 用のシンプルなパンくずリスト

※ widget version「 version='1' 」に対応

・投稿タイトルなし
・ラベルが複数ある場合すべて表示

① HTML 編集から「 Blog1 」へ進み、下記コードを探す
<b:include data='top' name='status-message'/>
② 下記コードをコピーし上記コードの直前(上)にペースト
<b:include data='posts' name='breadcrumb'/>
このようにします↓
<b:include data='posts' name='breadcrumb'/>
<b:include data='top' name='status-message'/>
③ 同じように「 Blog1 」で下記コードを探し、直前(上)に本体コードをペースト
<b:includable id='comment-form' var='post'>
パンくずリストのコード↓
<b:includable id='breadcrumb' var='posts'>
<div class='breadcrumb' itemscope='itemscope' itemtype='http://schema.org/BreadcrumbList'>
  <span itemprop='itemListElement' itemscope='itemscope' itemtype='http://schema.org/ListItem'>
    <a expr:href='data:blog.homepageUrl' itemprop='item'>
      <span itemprop='name'&gtlHome</span>
    </a>
    <meta content='1' itemprop='position'/>
  </span> &#160;&#155;&#160;
  <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:loop values='data:posts' var='post'>
      <b:if cond='data:post.labels'>
        <b:loop values='data:post.labels' var='label'>
          <span itemprop='itemListElement' itemscope='itemscope' itemtype='http://schema.org/ListItem'>
            <a expr:href='data:label.url' itemprop='item'>
              <span itemprop='name'><data:label.name/></span>
            </a>
            <meta content='2' itemprop='position'/>
          </span> &#160;&#155;&#160;
        </b:loop>
      </b:if>
    </b:loop>
  <b:else/>
    <b:if cond='data:blog.pageName != &quot;&quot;'>
      <span itemprop='itemListElement' itemscope='itemscope' itemtype='http://schema.org/ListItem'>
        <a expr:href='data:blog.url' itemprop='item'>
          <span itemprop='name'><data:blog.pageName/></span>
        </a>
        <meta content='2' itemprop='position'/>
      </span>
    </b:if>
  </b:if>
</div>
</b:includable&gt
これでパンくずリストが表示されます。
ページ上で複数ラベルはすべて表示されますが、Google 検索結果にはアルファベット順で後ろから数個が反映します。

CSS で文字調整

.breadcrumb,
.breadcrumb a {
    color: #686868;
    font-size: .9em;
}
文字サイズや文字色を調整するには上記 CSS で編集できます。
値は例なので変更してください。