はてなブログのサイドバーの最新記事にもっと見るリンクを表示

hatenaロゴ

はてなブログのサイドバーの最新記事一覧に「もっと見る」リンクを表示できるようになりましたが、それはただの月別アーカイブへのリンクでした。

はてなブログ開発ブログ - 最新記事モジュールでもっと見るボタンを設定できるようにしました - はてなブログ開発ブログ

もっと見る(最近の記事)

もともと、最新記事のタイトルが月別アーカイブへのリンクになっているので、「もっと見る」リンクを表示すると、同じリンクが2つになってしまいます。そこで、CSSで最新記事のタイトルのリンクを無効にしました(月別アーカイブのタイトルも無効になります)。

(CSSのコード:デザイン→カスタマイズ→デザインCSSに入力)

CSS
.hatena-module-title a {
    text-decoration: none;
    pointer-events: none;
}

ついでに「もっと見る」リンクに、はてな純正のアイコンを表示させる場合は次のとおり。

(CSSのコード:デザイン→カスタマイズ→デザインCSSに入力)

CSS
/* 「もっと見る」リンクのにアイコンを表示 */ 
.recent-entries-see-more-link:before {
    font-family: blogicon;
    content: "\f048";
}

/* 「もっと見る」リンクのにアイコンを表示 */ 
.recent-entries-see-more-link:after {
    font-family: blogicon;
    content: "\f049";
}

このCSSを適用させると、例えばこんな感じで表示されると思います→  もっと見る 

参考になるブログ・Webサイト
FOXISM - はてなブログで使えるアイコンフォントが増えてた(パンくずリストなど)

最新記事はあまり利用されていないような気がしますが、サイドバーがさびしくなってしまうので、とりあえず表示させています(「もっと見る」リンクも表示しました)。