はてなブログで記事の先頭にはてなスターとはてブボタンを表示させてみた

はてなブログだとダイアリーと異なり、記事の先頭にスターが表示されないんですね... ちょっと違和感があるので、JavaScriptで先頭にも表示するようにしてみた。

あと、ついでにはてなブックマークのボタンも先頭に表示してみた。各記事内だけでなくブログのトップページにも表示し、そこからブログ記事ごとにブックマーク可能なようにしています。

使いたい方は複製改変ご自由にどうそ。

使い方

  • サイドバーにHTMLのモジュールを追加し、以下のコードを貼付けます。
  • はてブのURLはご自身のブログURLに変更してください(http://wadahiro.hatenablog.comの箇所)。
<script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button_wo_al.js" charset="utf-8" async="async"></script>
<script type="text/javascript">
$(document).ready(function() {
    var footers = $("p.entry-footer-section");
    var headers = $(".entry-header");

    headers.each(function(index, header) {
        var footer = $(footers[index]);

        $(header).append("<br>");
        $(header).append($(footer));

        // Hatena Bookmark
        var titleLink = $(header).find(".entry-title a");
        var url = titleLink.attr("href");
        var title = titleLink.text();

        $(header).append('<a href="http://b.hatena.ne.jp/entry/http://wadahiro.hatenablog.com' + url + '" class="hatena-bookmark-button" data-hatena-bookmark-title="' + title + '" data-hatena-bookmark-layout="standard" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a>');
    });

});
</script>