複数投稿表示ページでタイトル一覧をまず表示する

あ、これいいなと思った Blogger カスタマイズ。

• Bloggerのアーカイブページやラベルページで記事タイトル一覧を表示 :: Holiday Webmaster Blog

ラベルページや検索ページ、アーカイブページといった複数の投稿が並ぶページ（トップページ除く）で、各投稿の内容を表示する前に、まず投稿タイトルの一覧を見せることができます。導入方法は上記リンクからご確認下さい。


クリボウだとこんなの

完全に便乗なんですが、クリボウが使うとしたらこんな感じにするかな？というのも上げておきます。



変更点

• タイトル一覧から日付を削除 … <data:post.dateHeader/> で表示される日付は、同じ日付に複数の投稿があると片方にしか表示されず、レイアウトが崩れてしまうため。
• リンク先をページ内に … 複数投稿が表示されている場合、一覧からパーマリンクに飛ぶよりページ内で移動する方が好みなので。パーマリンクを作成していなくても使えるし。

デモ

ここはレイアウトテンプレートじゃないので、動作は「写真日記」でご確認を。こんな感じになります。

導入方法

Blogger 管理画面「レイアウト ＞ HTML の編集」で「ウィジェットのテンプレートを展開」にチェックを入れ、<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/> で始まる「ブログウィジェット（投稿表示ウィジェット）」の中に、下記のコードを貼り付けます。

このウィジェット内ならどこでもいいんですが、おすすめは「ステータスメッセージ」の後。セクションが、ウィジェットが、インクルーダブルがと難しく考えずに <b:include data='top' name='status-message'/> を検索して、その次の行へ挿入してしまうのが吉です。

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

ということでよかったら一度お試し下さい。
最後になりましたが、面白いアイデアを教えてくださった naminorito さんに大感謝です！