2012年8月9日木曜日

[Blogger] 記事一覧

Blogger で不便なのは、アーカイブページやラベルページで記事の一覧がないこと。
もともと自分のメモ用に書いていたのだが、ある程度記事がたまると自分でも困る。
記事一覧みたいなガジェットを探していたのだが、 テンプレートカスタマイズで実現しているブログがあったので早速やってみることにする。

出所は、
"Holiday Webmaster Blog" では、以下のようなスクリプトになっている。

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<ul id='post-title-navigation'>
<span>このページの記事一覧</span>
<b:loop values='data:posts' var='post'>
    <li>
    <b:if cond='data:post.title'>
      <data:post.dateHeader/> - <a expr:href='"#" + data:post.id'><data:post.title/></a>
    <b:else/>
      <data:post.dateHeader/> - <a expr:href='"#" + data:post.id'><data:post.id/></a>
    </b:if>
    </li>
</b:loop>
</ul>
</b:if>
</b:if>

これをテンプレートに追加するだけで、 アーカイブページやラベルページに記事一覧が表示される。
素晴らしい。

ほとんど目的達成してしまっているのだが、 「クリボウの Blogger Tips」によると同一日の2つ目以降のポストには 「data:post.dateHeader」が入ってこないとのこと。
確かに、Blogger のヘルプにもそう書いてある。

dateHeader がない行でレイアウトがずれてしまうため「クリボウの Blogger Tips」では日付を除去するという作戦をとっているが、 日付は表示したいので「なくても崩れない」方式で行くことにする。



というわけで、記事一覧は table 形式で出力する方式に変更。
また、元スクリプトだと静的ページでも記事一覧が出てしまうので、 「data:blog.pageType」が「static_page」なら表示しないようにして以下のコードを追加することにした。
挿入する箇所は、前回、 テンプレート中で現在表示されているページのタイプを判別した時と同様に

<b:widget id='Blog1' locked='true' title='ブログの投稿' type='Blog'>
の中の
<b:include data='top' name='status-message'/>
の直下。

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<table id='post-title-navigation'>
<span>このページの記事一覧</span>
<b:loop values='data:posts' var='post'>
    <tr>
    <b:if cond='data:post.title'>
     <td>● <data:post.dateHeader/> - </td>
     <td> <a expr:href='"#" + data:post.id'><data:post.title/></a></td>
    <b:else/>
     <td>● <data:post.dateHeader/> - </td>
     <td> <a expr:href='"#" + data:post.id'><data:post.id/></a></td>
    </b:if>
    </tr>
</b:loop>
</table>
</b:if>
</b:if>
</b:if>

うん、いい感じになった。



0 件のコメント:

コメントを投稿