少し前に月太郎さんと「8月7日は”バナナ”の日」なんていう話をしていたら、すでに去年のバナナの日にもその話題を書いていたことが判明。(参照:40本のバナナを喰わされた泥棒)。たしかに「去年のいまごろはどんなことを書いていたな」と、パッとは思い出せませんし、かといって逐一探したりもしませんから、去年の同月同日が参照できると便利です。
日々の暮しを書いた日記やなおさらだし、時事ネタでない記事でも意外に当時の記憶がよみがえったりします。「Letter from Yochomachi」でも「今日は何の日」で過去の同日の記事を出してきてますし、こういう使い方にも活用できそう。
それで似たような形のものを作ってみました。 JavaScript で日時を取得し、インラインフレームに別テンプレートを読込んで、1年前の同月同日を表示させます。JS、iframeがNGだと機能しません。
トップページでは閲覧している現在時刻を取得し、1年前の同月同日の記事を探します。(サンプル)
過去1年皆勤だったら、1年間は毎日、去年のストックを参照してくれますから少しは更新がサボれる、かも?
記事個別ページでは、その投稿日から1年前の同月同日を参照します。(サンプル)
作成・設置手順
■別テンプレート
まず読込むテンプレートを作成します。記事タイトルだけのごく簡単なものです(html&cssファイル)
ヘッダ内にスタイルを記述しているので文字サイズなどはそちらで調整できます。
★「longtimediary」という名称で保存する必要があります。違う名前にする場合はスクリプトで読み込むテンプレート名も揃えて変更します。
<!--topentry-->
<p>
<a href="<%topentry_link>" title="<%topentry_discription>" target="_parent"><%topentry_title></a>
</p>
<!--/topentry-->
<script type="text/javascript">
if("<!--topentry--><%topentry_title><!--/topentry-->".length == 0){
document.write('<p><%sub_title>の投稿はありません</p>');}
</script>
記事タイトル部のリンクにtitle属性で記事概要を入れています。不要なら削除するか、あるいは(インラインフレームの幅を広げる必要がありますが) title属性でなく、テキストとして出してしまっていいかもしれません。
スクリプトは記事タイトルが空だった場合を、該当なしと判定して「投稿はありません」と表示させます。
■スクリプト
次に現在のテンプレートに設置するJavaScript部分。まずプラグインのフリーエリアとかにそのまま入れられる短い版。(ファイル)
1年前の同月同日をインラインフレーム内に読み込む仕組みですが、初年の記事を参照している場合だと、あきらかにそれより前年、というのはないわけです。
それで少し拡張してあるのがこちら。(ファイル:下記内容と同じ)
<!--permanent_area-->
<script type="text/JavaScript"><!--
<!--topentry-->
if (<%topentry_year> > 2005){
document.write('<h3>1年前に書いた記事</h3><iframe src="/?style2=longtimediary&date='+ (<%topentry_year>-1) + '<%topentry_month><%topentry_day>" marginwidth="0" marginheight="0" border="0" frameborder="0" style="border:none; width:100%; height:5em; overflow:hidden;" scrolling="no"></iframe>');}
else{
document.write('<h3>1年後に書いた記事</h3><iframe src="/?style2=longtimediary&date='+ (<%topentry_year>+1) + '<%topentry_month><%topentry_day>" marginwidth="0" marginheight="0" border="0" frameborder="0" style="border:none; width:100%; height:5em; overflow:hidden;" scrolling="no"></iframe>');}
<!--/topentry-->
// --></script>
<!--/permanent_area-->
<!--not_permanent_area-->
<h3>1年前のきょうの記事</h3>
<script type="text/JavaScript"><!--
dd = new Date();
yy = dd.getFullYear() -1;
mm = dd.getMonth() + 1;
dd = dd.getDate();
if (mm < 10) { mm = "0" + mm; }
if (dd < 10) { dd = "0" + dd; }
document.write('<iframe src="/?style2=longtimediary&date=' + (yy) + (mm) + (dd) + '" marginwidth="0" marginheight="0" border="0" frameborder="0" style="border:none; width:100%; height:5em; overflow:hidden;" scrolling="no"></iframe>');
// --></script>
<!--/not_permanent_area-->
たとえば、このブログだと2005年から書き始めているので、その1年前の2004年を探しても該当するものが出てきません。なので2005年の記事からは、1年「後」を参照するように変更しています。コードの始めの方にある 2005 をそのブログの初年に書き換えます。
そうすると「1年前のきょうの記事」という見出しで統一できないので、「1年後…」に見出しから変えています。これだと(プラグインタイトルがある関係で)フリーエリアにそのまま入れられません。面倒だと思う場合は、「長年日記」とか「同月同日エントリ」とか「きょうは何の日」など、共通できる見出しをつけて、「h3」部分を削除します。
フレームの高さは5emになっています。2件くらいまでは表示できるかと思うのですが、タイトルの長めなブログや、同月同日に複数件のエントリがあるようなら広げて下さい。(テンプレート側に sameday を入れて日付ネストする方法もあります。)