最新記事モジュールでもっと見るボタンを設定できるようになった

先日、はてなブログがアップデートされ、サイドバーに表示される「最新記事モジュール」で設定された表示件数を超える場合「もっと見る」リンクを表示できるようになりました。

生成されるhtml

<div class="urllist-see-more recent-entries-see-more">
<a href="https://www.foxism.jp/archive" class="urllist-see-more-link recent-entries-see-more-link">
もっと見る
</a>
</div>

実際に表示させてみたところ、上記のようなhtmlでした。すごくシンプル。そしてここにデフォルトでは特にcssはついてないようでした。(継承されるもののみ)

とりあえずのcss

まぁhtmlもシンプルですし、とくに大きな装飾する必要もないので、私の場合は簡単に枠で囲っておきました。

.urllist-see-more-link{
display: block;
border: 1px solid #999;
text-align: center;
line-height: 2.5;
}

::beforeを使って「もっと見る」の前にアイコンを表示させてもいいかもしれませんね。

とりあえず、そんなとこで。

ABOUT ME
著者近影
宮城島 俊太 (Shunta MIYAGISHIMA)

茨城県つくば市在住のウェブサイト運営者。ネット上ではc-miya、orefolderなどの名前で活動しています。

ストレスに弱いので、できるだけ好きなことだけをして生きたいと思いながら生活しています。「楽しい」が優先順位の一番上に来るようにしたいですね。

CATEGORY
RANKING