シーサーブログのサイドバーの記事タイトルを全て表示させる方法

新デザインのシーサーブログの記事下やサイドバーに表示される記事のタイトルをすべて表示させる方法について書いていきます。

新デザインのシーサーブログでは記事下に同じカテゴリーの記事がサムネイル付きで新しい順に表示されるのですが、デフォルト設定だと表示のされ方が全然イケてなくて、何の記事か極めて分かりにくいです。

ちなみにBeforeは↓です。これでは次の記事を読もうとは思わないですよね。

Before

少しでも長くブログ内に滞在してもらうために、他の記事を載せているのにこれでは逆効果なので、サムネイルを消して記事タイトルを全て表示させるようにカスタマイズしました。
カスタマイズ後は↓のようになります。
After

同様にサイドバーに配置しているブログパーツ「最近の記事」も記事タイトルを全文表示させるようにしました。抜粋文も無くしてスッキリさせました。
てか、デフォルト設定が内容を伝える気無さすぎですよね。。
Before

After

このようなカスタマイズのやり方を解説していきます。
この記事中のソースコードは全て半角で表示されるようにしてあるので、コピペしてもらっても大丈夫です。
もし動作しなかった場合はお知らせいただけるとありがたいです。

記事下の同カテゴリー記事タイトルを全文表示させる方法

デザイン＞デザイン設定＞デザインタイトルをクリック＞HTML編集
109-131行目くらいにある

<% if:list_category_article -%>
<div class="module module--category-recent-entry">
<h3 class="module__heading"><% article_category.name -%>の最新記事</h3>
<div class="module__body">
<ul class="recent-entry">
<% loop:list_category_article -%>
<li class="recent-entry__item">
<a href="<% article.page_url -%>">
<div class="recent-entry__thumnail">
<% if:article.first_image -%>
<img src="<% article.first_image.page_url_thumbnail -%>" alt="" />
<% else -%>
<div class="no-image"><div class="no-image--inner">no image</div></div>
<% /if -%>
</div>
<p><% article.subject | text_summary(20) -%></p>
</a>
</li>
<% /loop -%>
</ul>
</div>
</div>
<% /if -%>

を消して↓のコードに置き換える。

<% if:list_category_article -%>
<div class="listCategoryArticle">
【<% article_category.name %>の最新記事】<br />
<ul>
<% loop:list_category_article %>
<li><a href="<% article.page_url %>">・<% article.subject | text_summary(100) %></a></li>
<% /loop %>
</ul>
</div>
<% /if %>

プレビューで確認して問題なければ保存で完了です。
これで半角100文字全角50文字までのタイトルが表示されるようになります。もっと長いタイトルを表示したい場合は、text_summary(100)のカッコ内の数字を大きくしてください。

サイドバーの最近の記事の記事タイトルを全文表示させる方法

デザイン＞デザイン設定＞デザインタイトルをクリック＞コンテンツHTML編集
24行目くらいからの

<h4 class="recent-entry__title">
<% if:article.first_image -%>
<% article.subject | tag_strip | shorten(26) | mark_raw -%>
<% else -%>
<% article.subject | tag_strip | shorten(36) | mark_raw -%>
<% /if -%>
</h4>
<p class="recent-entry__body">
<% if:article.first_image -%>
<% article.body | tag_strip | shorten(58) | mark_raw -%>
<% else -%>
<% article.body | tag_strip | shorten(74) | mark_raw -%>
<% /if -%>
</p>

を見つけ、

1) shorten(26)をshorten(100)にする。
これで記事内にサムネイル写真がある場合のタイトル表示数が半角100文字(全角50文字)になります。

2) shorten(36)をshorten(100)にする。
これで記事内にサムネイル写真が無い場合のタイトル表示数が半角100文字(全角50文字)になります。

3) 後半7行を削除する。
これで記事の抜粋文が消えます。
下のコードが残っていればOK。

<h4 class="recent-entry__title">
<% if:article.first_image -%>
<% article.subject | tag_strip | shorten(100) | mark_raw -%>
<% else -%>
<% article.subject | tag_strip | shorten(100) | mark_raw -%>
<% /if -%>
</h4>

プレビューで確認して問題なければ保存で完了です。