WordPressのトップページの記事の表示形式を変更する。【Cocoon】

ブログデザイン

どうも、taigaです。

今日は1週間ぶりにブログデザインを修正します。

今日やるのは、トップページの記事一覧の表示形式の変更です。

 

今回の作業を行うと、画像のように記事をカテゴリーごとに表示できるようになります。

現在のブログデザイン。

現在のブログデザインは、以下のようになっています。

一見すると何の問題もないように見えますが、記事一覧の部分をスクロールしてみると、

これまでの投稿記事がずらっと表示されています

 

この状態だと、

  • 記事の表示数が多すぎてサイトのバランスが悪い。
  • 目的の記事を探すのが大変。
  • 何よりも見栄えが悪い。

という問題がありますので、今回はこの部分を修正していきます!

表示変更の手順。

①「cocoon設定」から「インデックス」を選択。

「ダッシュボード」を開いて、「cocoon設定」→「インデックス」のタブを選択します。

②フロントページタイプの表示形式と表示カテゴリーを編集。

画面の一番上に「フロントページタイプ(β版)」という項目がありますので、

  1. 表示形式で「カテゴリごと」を選択。
  2. 表示カテゴリーで、表示したい項目をチェック。

今回は、全てのカテゴリーを表示したいので、全部にチェックを入れました。

これでトップページの記事は、カテゴリーごとに表示されるようになります。

 

ですが、このままだと各カテゴリーで4記事表示されてしまいます。

それだと結局サイトのバランスが悪くなってしまうので、続いて、表示する記事数を編集していきます。

③『「カテゴリごと」表示でカード数を変更する場合はこちら』をクリック。

先ほどの表示カテゴリーの下に青字の表示がありますので、それをクリックします。

④「エントリーカード表示数」を編集。

クリックすると、以下のように画面が展開されます。

画像に記入した通り、

  • 「新着エントリーカード表示数」は新着投稿記事の表示数
  • 「カテゴリーエントリーカード表示数」は各カテゴリー記事の表示数

になります。

デフォルトだとどちらも4個になっていますので、これを好きな個数に変更します。

taiga
taiga

僕は新着表示数を3個、カテゴリー表示数を2個にしました!

 

以上で作業は終わりになります。

完成。

サイトを確認してみると、これまでの記事が「新着記事」という項目に纏まっています。

記事数も設定した通り、3記事に圧縮して表示されてます。

スクロールをすると各カテゴリーの表示も確認できました。

記事数も設定した通り、2記事に圧縮されていますね。

終わりに。

ということで、今回は思った以上に簡単に変更ができました!

 

あんまりブログデザインに熱を出したくはないのですが、見ていただいてる方々にとっても視認性というのは非常に重要だと思うので、今後も気になった部分は修正していきたいと思います。

 

以上!

コメント

タイトルとURLをコピーしました