別ブログでwordpressのテーマ「simplicity」を使っています。サイトのトップページにカテゴリーごとに分けたすっきりしたデザインかつ新着記事を表示するカスタマイズのまとめです。
メインページにカテゴリー別で記事一覧表示
以前はトップページのメインに新着記事が一覧で表示されているだけでした。今回のカスタマイズを導入することで、カテゴリー別に記事（サムネイル入り）表示されるようになったことによって、すっきりしたデザインとなりました。
また、読者にとっても見やすいページとなったので直帰率を避けることにつながります。PV率効果も見込めるカスタマイズです。
wordpressのテーマ「simlicity」を使っている人も多いと思います。もともとがシンプルなだけに、自分次第で自由にカスタマイズできます。本当におすすめの無料テーマです。
今回カスタマイズするのに参考にしたのは
http://lahatnggusto.com/net/categorybox
ただし、この上記のサイトはバージョンが2.0以降では動作が上手くいきませんでした。古いバージョンの方は上記のサイトを参考にカスタマイズしてください。
僕はsimplicity2.3を使っているのでいろいろ修正を加えました。最新のバージョンでも動作確認済です。
設定手順１
事前にインストールが必要なプラグインは page builder by siteorigin.とphp text widget. この二つの設定方法は別記事にまとめています。１０分程度で設定できると思います。以下を参考にしてくだい。
２つのプラグインを設定後、カテゴリー別に一覧表示するカスタマイズ方法を書いています。php text widjetはインストールして有効化するのみです。
設定手順２
page builder by siteoriginを設定完了後、ウジェットにテキスト貼り付けてください。テキストには自由にhtmlを書き込みことが可能で広告やsnsを表示することができます。今回はテキストにカテゴリー別に新着記事をサムネイル付きで表示するように設定してします。
参考したブログはサムネイルと新着記事がなぜかうまく表示されなかった。よくよく調べるとsimplicity２以降のバージョンでは動作未確認みたいです。 今回、いろいろ修正を加えてsimplicityの2.3〜4まで動作確認済の修正版とします。
以下のコードをテキストテキストウェジェットにコピペして貼り付けてください。
１行目→カテゴリーURLと表示したいカテゴリー名を入力します。
14行目→表示したいカテゴリーのスラッグIDを入力します。
スラッグIDとは、投稿一覧→カテゴリ→表示したいカテゴリーを選択すると
使用しているブラウザ（yahooやグーグルなど）上のURLバー欄でID確認できます。
15行目→新着記事で表示したい投稿数です。デフォルトは５になっています。
cssの設定
最後にcssを貼り付けて背景色や色を設定しましょう。
５行目→カテゴリー名の背景色を変更できます。他にも詳しい設定がありますが、基本的な操作は以上になります。お疲れ様でした。
