【WordPress】Stinger3で記事下の「関連記事」の表示を変更しました

各記事の下部に表示される「関連記事」ですが、同じカテゴリーの記事を表示させてくれて、読者の方に他の記事を読んでもらえるチャンスを増やすという意味ではすばらしいのですが、一方であまりに下に長くなってしまっているのが気になりました。

他のブログで採用しているようなもっとキュッとしたデザインにしたいと思いやってみましたがので、方法を紹介したいと思います。

参考にしたサイト

いつもの事ながら、先達の知恵を拝借させていただきます。

今回参考にさせていただいたのはこちらのサイト。

STINGER3の「関連記事」表示を横並びにカスタマイズしてみた

実際にやってみた結果

上記サイトでは、single.phpのdl, dt, ddタグをul, li,divタグに変更することで関連記事の表示をスッキリさせているとのこと。

当サイトでも基本的にはこの方法に従ってカスタマイズしてみました。そしてstyle.cssにも追加で記載を行えば完了です。

その結果、「関連記事」はこのように表示されるようになりました。

だいぶスッキリしたように思います。

Tomo’s Comment　@tommasteroflifeさんをフォロー

関連記事の省スペース化についてはこれまでも取り組みたいと思いつつ後回しになっていました。

今回はzenbackを導入したことに伴い変更したのですが、再度zenbackとのバランスも含めて眺めて改善すべきは改善していきたいと考えています。