この「次の投稿」「前の投稿」を、記事のタイトル名に変えられたらいいなーと思ったのですが、実は JQuery を使えばちょいちょいと変更できることを知りました（テンプレートの編集は不要です）。
手順
Blogger の管理画面で「レイアウト」を開き、「ガジェットを追加」をクリックします（「ガジェットを追加」はどれを選んでも構いません）。
「HTML/JavaScript」を追加します。
「コンテンツ」に、以下の JavaScript をコピー＆ペーストします。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>※このスクリプトは How to Replace Older Posts and Newer Posts Links with Blogger Post Titles より引用しています。
<script type="text/javascript">
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink+" h3:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link:first").text();
$("a.blog-pager-older-link").text(olderLinkTitle);
});
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink+" h3:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link:first").text();
$("a.blog-pager-newer-link").text(newerLinkTitle);
});
</script>
ちょいと改造
基本的にはこのスクリプトで何ら問題無く動作するのですが、記事名が長すぎる場合などに見映えが損なわれる場合があるので、次のように改造してみました。あと、async は単なる気休めです(笑)。<script async='async' type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script async='async' type="text/javascript">
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink+" h3:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link:first").text();
if( olderLinkTitle.length > 16 ) {
olderLinkTitle = olderLinkTitle.substr(0, 16) + "...";
}
$("a.blog-pager-older-link").text(olderLinkTitle);
});
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink+" h3:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link:first").text();
if( newerLinkTitle.length > 16 ) {
newerLinkTitle = newerLinkTitle.substr(0, 16) + "...";
}
$("a.blog-pager-newer-link").text(newerLinkTitle);
});
</script>
Blogger の小枝
