【Blogger】ラベルをカテゴリーラベルと#タグ風に分けてみた

Bloggerのラベルを少し変更しました。

今迄は気にしていなかったのですが、別ブログで書いた投稿で気になってしまいラベルをカテゴリー(大分類)とハッシュタグ(小分類)に分けてみました。

投稿記事のラベル表示をカテゴリーとハッシュタグに分けてみる

例えば、スニーカーに関する記事を投稿をした場合、Bloggerの機能でラベルを付けても、スニーカー、ナイキ、エアジョーダン…といった感じで並列化されたラベルになっています。

願望としてはカテゴリー(大分類)にスニーカー、ハッシュタグ(小分類)をナイキやエアジョーダンにしたいところです。

以下の感じ。

そこでラベル作成時に特定のキーワードを付けて、表示する時に分類させてみようと思います。

具体的には、#を付与していないラベルと#を付与したラベルをタグとしてを強引に分けて投稿記事に出力させる感じです。

変更する場合、テーマ（テンプレート）のバックアップを取ってから変更しましょう。

HTMLの変更はBloggerの管理画面より テーマ＞＞HTMLの編集と進みテンプレートのHTMLを変更します。尚、変更については自己責任でお願いします。

以下、投稿記事の設置したい箇所に以下コードを記述します。(例は <b:includable id='post' >内末端に配置を想定しています。)

<b:if cond='data:blog.pageType == "item"'>

<b:loop values='data:post.labels where (l => l.name not contains "#")' var='label'>

</b:loop>

</span>

</div>

<b:loop values='data:post.labels where (l => l.name contains "#")' var='label'>

</b:loop>

</span>

</div>

</b:if>

以下簡単な説明。

まず、最初の<b:loop>。

以前も使ったラムダ式を使っています。

<b:loop values='data:post.labels where (l => l.name not contains "#")' var='label'>

ラベルの情報が格納されているpost.labels.nameから#が付与されていないラベルをvar属性でlabelに格納します。

where (l => l.name not contains "#") の箇所が"#を含まない"とするラムダ式の記述。

次に<a>タグで"#を含まない"ラベルを出力します。

<b:loop>タグで出来たデータセット:labelからラベル一覧サーチのurl(data:label.url )とラベル名(label.name)を出力しています。

<b:loop>2回目以降も同じ。"#を含む"contains "#"に変わるだけ。

スタイルは各々cssにてご自由に。

まぁラベルを分けたはいいけど、正直利用価値があるかはわからない。
注意しなければならないのは、ラベルを付ける時にしっかり管理しなければならないところ。ユーザーフレンドリーでは無いな。

HTML内で出来たので良しとしましょう。

以上