Blogger記事のラベルを列挙表示する

当ブログでは、各記事のヘッダ部分にその記事につけられているラベルの一覧を列挙表示しています。

この記事では、その実装方法をご紹介いたします。

記事ヘッダ部分を検索する

テンプレートから各記事のヘッダ部分を検索します。



クラス名が「post-header」になっている箇所が記事のヘッダ部分です。今回は、この段落の内容をラベルの列挙表示に置換します。

記事ヘッダを編集する

検索した記事ヘッダの内容を、以下のように置換します。



各ポストに存在するラベル一覧をループでそれぞれ名称表示と、各項目間のカンマを付記しています。

各ラベルにリンクを追加する

当ブログでは実装していませんが、上記で列挙しているlabel要素はそれぞれurlを保持しています。このurlは各ラベルの一覧表示ページへのリンクを表しているため、以下のように実装すると、各ラベルごとの絞り込みが可能になります。