新着記事一覧を自動で表示してくれるプラグイン「Newpost Catch」は便利なので使ってる人も多いと思います。
このサイトでも長らくお世話になっていたのですが、先日pagespeed insightsで記事の表示スピードを計ったところ、スマホの評価が63点(Poor)と低い数字。
少しでも表示速度を改善するため、新着記事一覧をプラグインを使わずに表示してみることにしました。

minneバナー

新着記事表示のための編集ファイル

このサイトは「emanon」というテンプレートを使っています。
新着記事はサイドバーに表示させたいので、サイドバーファイルをカスタマイズします。

記事ページのサイドバー格納場所
/wp-content/themes/emanon_free/blog_templates/single
の中に以下3つのphpファイルが格納されています。

・left-sidebar-single.php(左サイドバー)
・right-sidebar-single.php(右サイドバー)
・no-sidebar-single.php(サイドバーなし)

左右どちらにサイドバーが表示されているか、またはサイドバーを使用していない場合によって編集するファイルが変わります。
今回は「right-sidebar-single.php」を例にします。

※ファイルに修正を加える場合は必ずバックアップを取っておきましょう。

right-sidebar-single.phpの20行目あたりにこのような記述があると思います。

<aside class=”col-sidebar sidebar”>の直下に下のコードをコピーして追加してください。

<?php get_sidebar(); ?>はサイドバーウィジェットを呼び出すための記述なので削除しないようにしましょう。
これを消してしまうと、ウィジェットに設定しているカテゴリ表示などが非表示になってしまいます。

CSSはこちらを追加。

これで新着記事が一覧で表示されました。

カスタマイズ方法はこちらの記事を参考にして、少し変更を加えて掲載させていただきました。

▼【WordPress】サムネイル付の新着記事一覧をカテゴリー別でプラグイン不要で表示する方法
http://wispyon.com/newentry-category-thumbnail/

この一覧のすごいところは、同じカテゴリの中から新着一覧を表示してくれるところ。
例えばゲームの記事を読んでる人にはゲームカテゴリの新着を見せることができるので、サイト内の回遊率アップが狙えます。
テーマが近しい記事同士を紐づけることで内部SEOも期待できるとのこと。
かゆいところに手が届く機能がプラグインなしで実装できました。

ページスピードは改善した?

「Newpost Catch」をやめてプラグインを使わずに新着一覧を表示することができました。
果たしてページの表示スピードは改善したのでしょうか。

<変更前>SP:63 PC:77
<変更後>SP:62 PC:77

あれ?プラグインをやめたのに点数はむしろ落ちてしまいました。
レンダリングをブロックするCSS/javascriptからもNewpost Catchの表示がなくなったのになぜ?

新着記事一覧のプラグイン表示を変更して、前と大きく変わったのはサムネイル。
以前のものは小さめの正方形。今回はより画像が目立つように大きい表示に変えてみました。
画像を大きく表示することで読み込みに遅れが出た、というのが仮説です。

まとめ

プラグインの使用をやめたことでページの表示スピードアップを狙った今回の検証ですが、結果は失敗に終わってしまいました。
ただ、表示スピードアップ対策はこれからも続けていきます。

もしかしたら他のプラグインの使用をやめることで、相乗効果的に改善することもあるのでは⁉という期待のもと、しばらくこのままでいきたいと思います。

次回は目次を自動表示してくれる「Table of Contents Plus」の使用をやめて、スピードアップ検証する予定です。
結果は追って報告するのでお楽しみに。