にじ魂 > livedoorBlogカスタマイズ

タイトル一覧でブログを読み易くしよう

<<天皇は黙っとけSEOで一番大切なのは正しいHTMLを書く事>>
弱小エンジニアの小言さんの月別アーカイブにタイトルリストをつけるを参考に月別・カテゴリ別アーカイブを改造した。

小言さんのを更にカスタマイズしてタイトルリストから個別記事にリンクを張るのではなく、ページ内の記事の部分にジャンプするように変えたので、個別記事を読み込むよりも表示速度が圧倒的に早い!
さらにリンクのコメントの数も分かるようにしてみました。
サンプル

この改造を施すと、ブログの読み方が劇的に変わるね。もう無駄にマウスホイールをグリグリ回してページをスクロールさせる必要がなくなるのです。「タイトル一覧」からパっと読みたい記事に移動できるからね。この差はかなり大きいよ

やり方は至って簡単。
月別アーカイブのHTMLテンプレートの
<div id="content">
<div class="blog">

この記述の下辺りに
<h2 class="date" id="menu">タイトル一覧</h2>

<div class="blogbody">
<div class="main">

<MonthlyArticlesLoop>
<a href="#<$ArticleId$>"><$ArticleTitle ESCAPE$> (<$ArticleCommentCount$>)</a> 
</MonthlyArticlesLoop>

</div>
</div>
↑これを付け足すだけ。

この後に「Blogの再構築」で月別アーカイブを再構築すればOK。
カテゴリ別アーカイブにも同じのをつけるには独自タグの<MonthlyArticlesLoop>を<CategorizedArticlesLoop>に書き換える。同様にトップページにやるにはこれを<IndexArticlesLoop>にするだけ。

タイトル一覧を箇条書きにして番号を振りたいなら
<h2 class="date" id="menu">タイトル一覧</h2>
<div class="blogbody">
<ol>

<MonthlyArticlesLoop>
<li><a href="#<$ArticleId$>"><$ArticleTitle ESCAPE$></a> (<$ArticleCommentCount$>)</li>
</MonthlyArticlesLoop>

</ol>
</div>

こうするべし。
サンプル2

ついでに<div class="posted">内に
│<a class="aposted" href="#menu">タイトル一覧▲</a>
と書いて、タイトル一覧の近くまで戻れるリンクを張っておくと利便性が向上するぞ。
by 箱男 2004年11月03日 10:44 新着コメント記事一覧
最近の記事
こだわりを捨てると楽になる
世界で最も格差のある国、日本
迷ったら答えを変えろ
BNF氏には良い夢みさせてもらった
ドラゴンボールを世界遺産に
金利が経済成長率を左右する
コメント(11)
スノー:2004年11月07日 21:57

おお、これいいですね。
早速導入してみました。
ちょっとだけ弄ってトラックバック数も表示するようにしてみました。

bali:2004年11月29日 11:29

takoashi さんとこから、おじゃまにきました。
とても参考になることがたくさんあり、うれしくなりました。(^^♪

さっそく、このぺーじのTOPへ▲をつけてみました。
ありがとうございます。

bali:2004年11月29日 14:16

わざわざ教えに来ていただいて、ありがとうございました。
箱男さん(でいいんですか?)
のおっしゃるとおりにしてみました。
やっぱり、具合がいいです。
親切に感謝します。(^o^)丿

minmei:2005年02月07日 23:13

タイトル一覧、いいですねー。使わせてもらいました。
自分のblogでは同カテゴリの記事の量が多くなるので
カテゴリのページではサイドバーに表示してみました。
自分で見直したいときにも重宝します。

他にもコメントを掲示板風に、も使わせて頂きました。
これもいいかんじです。
ありがとうございました。

m2lovers:2005年04月29日 02:35

はじめまして。
タイトル一覧使わせていただきました。
見にくて仕方なかったのですがスッキリしました。
タグとか良くわからないのでとても助かります。
ありがとうございました。

rappiko:2005年05月15日 17:57

初めまして。
タイトル一覧のカスタマイズを使わせて頂きました。
すごく気になっていたところだったので、とてもうれしいです。
ありがとうございました。

kika:2005年07月27日 23:41

アーカイブ見にくい…と思ってたので、すごく参考になりました。
ありがとうございます。

詩夜:2005年07月29日 15:36

初めまして。
参考にさせていただきました。
HTMLとか全然分からないのですが、とても分かりやすかったです。
ありがとうございました。

くじ:2005年11月10日 20:26

私は月もカテも30個ずつしか表示していないので、
「前・次のページ」を併用して使わせていただきました。素晴らしいです。ありがとうございました^^

桂馬:2005年11月28日 17:23

ご指摘ありがとうございました

loop内のアンカーをいらないと思って削除してしまっていました

法学:2006年01月21日 11:35

非常に有意義な情報をありがとうございました!!!
早速HPにも取り付けてみました。

管理人様のわかりやすい解説は他のページをしのぎます。

名前: URL:
カテゴリー: 戦争論生きるヒントオタク哲学民主主義掲示板