Bloggerの記事タイトル下にラベル(カテゴリー)を表示させる方法

Bloggerのデフォルトでは、PC表示で記事下にはラベル(カテゴリー)が表示されますが、記事タイトル下には、表示されません。

Bloggerの場合、ラベルをカテゴリーとして使うわけですから、記事タイトル下にもカテゴリーとしてのラベル表示があると、ユーザーにとって記事が探しやすくなります。

スポンサーリンク

BloggerのPCで記事タイトル下にラベルを表示させるには、テンプレートでHTML編集を行う必要があります。

HTML編集で、「post-header-line-1」で検索します。2か所あるはずで、どちらかがPC表示、もう片方がモバイル表示用となります。

PCとモバイルの表示させたい方、あるいは両方に次のコードを挿入すればOKです。

<span class='post-labels'>
        <b:if cond='data:top.showPostLabels and data:post.labels'>
          <data:postLabelsLabel/>
          <b:loop values='data:post.labels' var='label'>
            <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='not data:label.isLast'>,</b:if>
          </b:loop>
        </b:if>
      </span>


これで、こんなふうに、記事タイトル下にラベルが表示されるはずです。

注意！テンプレートの編集は、必ずバックアップをとってから行ってくださいね。

スポンサーリンク