読者です 読者をやめる 読者になる 読者になる

はてなブログで古い記事にメッセージを表示するスクリプト

ブログなどで記事を開くと表示される「この記事は○年以上経過しています」みたいなメッセージを、はてなブログでも表示できるようにしてみました。デザインテーマにもよりますが、通常は記事の先頭に日付、末尾に○日前があるので必要なさそうですけど。

f:id:splicom:20150916120336j:plain

ソース

<script type="text/javascript">
// 記事を開いた日時
var today = new Date();

// 記事の投稿日時
var updated    = document.getElementsByClassName("updated");
var datestring = updated.item(0).getAttribute("datetime");
var entry_date = new Date(datestring);

// 記事の投稿日時に一年を加算する
entry_date.setFullYear(entry_date.getFullYear()+1);

// 記事の投稿日時が記事を開いた日時よりも過去ならメッセージを追加
if(entry_date <= today){
    var doc = document.getElementsByClassName("entry-content").item(0);
    var entry_notice = "<div class=\"entry-notice\">この記事は投稿されてから一年以上経過しています</div>";
    doc.innerHTML =  entry_notice + doc.innerHTML;
}
</script>

管理画面からデザイン→カスタマイズ→記事→記事上下のカスタマイズ→記事下に追加すれば表示されるはず。コメントの削除やメッセージの内容は適宜変更してください。なお、はてなブログには記事の最終更新日時は無い(出力されていないだけでデータは持っているかもしれませんが)ので、投稿後の更新については考慮していません。

CSSのサンプルも載せておきます。

.entry-notice{
    text-align: right;
    font-size: 80%;
    color: #999;
    background-color: #F0F0FA;
    margin-bottom: 20px;
}

2015/09/17 09:02 追記

id:psneさんに最終更新日はサイトマップから確認できることを教えていただきました。ありがとうございます。なるべく通信の発生は避けたいですし、サイトマップのページがわかれているので記事のURLとマッチさせるのも手間がかかりそうですね。コメントの通りこのまま考慮しない方向でいきたいと思います。