Seesaaブログに追記を使わず「続きを読む」を設置
当サイトはSeesaaブログからWordPressへと引っ越し致しました。
引っ越し記事も後ほど書こうと思いますが、まだSeesaaブログで行ったカスタマイズが残っているので、そちらを先に書いてしまおうかと思います。
Seesaaブログはデフォルトではトップページやカテゴリページなど、記事一覧が表示されるページにも記事本文が全て記載されます。
最近ではこういうページではざっと記事を見渡せるように最初のほうのみ表示して、詳細については記事ページで見てもらうといったブログサイトが多いように思います。
Seesaaブログでは追記という機能を使うことで実現できますが、今回は追記を使わずカスタマイズで同様の機能を作る方法をご紹介します。
以下のようなかんじで表示されるようになります。
Seesaaブログの追記
Seesaaブログでは記事を書く際、本文と追記という２つの入力欄があります。
追記へ入力すると、トップやカテゴリページには本文と続きを読むという記事ページへのリンク、記事ページには本文と追記の両方が表示されます。
ただし、記事の最初の方のみ本文に、残りを追記に書くというはどちらかというと追記に書く部分が本文になるので、若干違和感があります
また、これから書く記事はまだしも、過去記事を全部本文と追記に分け直すというのも億劫です。
自動で本文の最初のほうを表示するようカスタマイズ
簡単な記事HTMLの編集でトップとカテゴリページに記事の冒頭のみ表示させることができます。
なるべくそのまま載せているため改行が無く若干見にくいですが、以下の4行目の太字の部分を追加します。
<% if:page_name eq 'article' -%>
<div class="text"><% if:diet_log %><% include:article_diet_file %><% /if %><% article.entire_body | bodyfilter(article_info,blog) %><% if:list_tag %><div class="tag-word">タグ：<% loop:list_tag %><a href="<% blog.tag_url(tag) %>"><% tag.word %></a> <% /loop %></div><% /if %>
<% else -%>
<div class="text"><% if:diet_log %><% include:article_diet_file %><% /if %><% article.first_body | bodyfilter(article_info,blog) | text_summary(240)%><br/><a href="<% article.page_url %>">続きを読む</a><% if:list_tag %><div class="tag-word">タグ：<% loop:list_tag %><a href="<% blog.tag_url(tag) %>"><% tag.word %></a> <% /loop %></div><% /if %>
<% else -%>
以下抜粋です。text_summary(240)で本文の最初の方のみ表示させています。
数字はバイト数なので、240で全角120文字です。
この数字を変更する事で表示させる文字数を変更できます。
<% article.first_body | bodyfilter(article_info,blog) | text_summary(240)%><br/><a href="<% article.page_url %>">続きを読む</a>注意点
文字数が少ない記事がある場合は注意が必要です。
本文全部が表示されるような場合でも、続きを読むが表示されてしまいます。
text_summaryの数字はブログの文字数を見て調整したほうがよいかもしれません。
変更したHTML
今回変更したHTMLを以下に公開しています。revisionを見ると変更した箇所がわかりやすいかと思います。
記事HTML
https://gist.github.com/kantan2015/f13b0b696edc3a303ead/464f4d661e719784bfcf1909c69341ad8a50a137