はてなブログで、「続きを読む」機能を使うには?

f:id:athena_diary:20170322175936j:plain

 

トップページなどのブログの一覧が表示されるページでは、各ブログのページがそのまま表示されていると全体像が分かりづらく、スクロールも大変ですよね。

はてなブログで「続きを読む」機能を使う方法を、紹介したいと思います。

 

ブログ編集のページで、任意の位置にカーソルを置いてから、メニューにある「続きを読む」アイコンをクリックすると
-------------------------------------
のような感じで区切られます。これだけです。すごくシンプルですよね。
※HTMLでは <!-- more -->というタグが埋め込まれています。

 

注意点

もし、「続きを読む」のリンクが目立たないと、ものすごく文章量の少ないコンテンツだと勘違いされるかもしれません。


私が使っているテーマの場合も、そのリンクが見にくかったので
以下のような感じでスタイルを設定してみました。

.entry-content a.entry-see-more{
font-size: 1.5em;
padding: 5px;
border-radius: 5px;
background-color: purple;
color: white;
}