2013年10月17日木曜日

Bloggerのラベルをschema.orgのkeywordsに対応させる

2行追加するだけで、Bloggerのラベルをschema.orgのkeywords プロパティに設定できます。

テンプレートがschema.orgに対応しているのが前提です。
新しいテンプレートなら、ほとんど、http://schema.org/BlogPosting に設定されています。



Bloggerの投稿にschema.orgのkeywordを設定する方法

<span class='post-labels'>を検索してラベルを表示している場所を見つけます。
モバイルテンプレートを有効にしている場合は2ヶ所になるはずです。

変更前

<span class='post-labels'>
    <b:if cond='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='data:label.isLast != &quot;true&quot;'>,</b:if>
    </b:loop>
    </b:if>
</span>

<b:loop> </b:loop>を<span itemprop='keywords'> </span> で囲います。

<span class='post-labels'>
    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <span itemprop='keywords'>
    <b:loop values='data:post.labels' var='label'>
        <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
    </b:loop>
    </span>
    </b:if>
</span>

構造化データ テスト ツールの結果
デスクリプションと同じような記述方法

Bloggerの投稿にschema.orgのkeywordを設定する方法2

hatom-feed の tagのようにするなら、1行をほんの少し変更するだけですみます。

変更前

<a expr:href='data:label.url' rel='tag'><data:label.name/></a>

itemprop='keywords'を追加

<a expr:href='data:label.url' rel='tag' itemprop='keywords'><data:label.name/></a>

構造化データ テスト ツールの結果
keywordsごとにPropertyを設定

ラベル1つにつき、 itemprop='keywords'を設定しています。構造化データ も問題ありませんので、こちらでもいいのですが、一応、Property はkeywordsなのと、ソースがスマートでないです。
ラベルの表示をボタン風に改造しているなど、,(コンマ)がない場合に使えます。

ブログの記事毎のfooterのkeywordの行に設定する。

footerの2行目にラベルがある場合
<div class='post-footer-line post-footer-line-2' itemprop='keywords'>
または、一つ下の
<span class='post-labels' itemprop='keywords'>に設定

構造化データ テスト ツールの結果
data:label.nameも入ってしまう

これは、ラベル: と言う文字もキーワードとして扱われてしまいこのブログでは旨くいきませんが、文字を表示しない設定にしてあるなら、lineのboxの内容がすべてキーワード エリアになってキリが良いです。