WordPressのテーマCocoonを使っています。
記事をカテゴリーごとに分ける方法を教えて。
こういった方に向けた記事です。
WordPressでブログを立ち上げると、トップページの初期状態は、記事の一覧が新着順に表示される形式になっています。
目的の記事を探すとき、ページをスクロールしたり、次のページに移動したり、あるいはメニューを探す必要がありますよね。
せっかくたくさんの記事を書いても、トップページが初期状態のままだと、読者が記事を見つけるのに大変な思いをしているかもしれません。
トップページの新着記事をカテゴリーごとに分類すれば、記事が見つかりやすくなります。
一般的な方法としては固定ページを作成して、トップページに指定するといった作業が必要ですが、Cocoonの機能を使えば簡単に実現できます。
本当に1クリックでできちゃうんだよ。
今回はCocoonの機能を使って、トップページを簡単にカスタマイズする方法を解説します。
※バージョン2.1.6以降で、β版としてこの機能が追加されています。
WordPressのテーマCocoonでトップページをカスタマイズ
まず完成イメージはこちらです。
※デザインの設定によって実際の見え方は異なります。
図の左のように初期状態では記事が新しいものから順に表示されます。
Cocoonの設定によってカテゴリごとに分けて表示すると、右のようになります。
他にもタブで分けたり、カテゴリーごとでもカラム数を変更したりすることもできます。
こういったイメージに変更する手順を解説しますね。
トップページをカテゴリーごとに表示する手順
（1）WordPressのダッシュボードを開き「Cocoon設定」→「インデックス」をクリックします。
（2）「フロントページタイプ（β版）」のメニューで「表示形式」「表示カテゴリー」からお好きなタイプを選びます。
（3）「表示カテゴリー」では、トップページに表示したいカテゴリーにチェックを入れてください。
変更したら「変更をまとめて保存」をクリック。
作業としてはこれだけです。
各項目で、それぞれどんなイメージになるのかを、以下で解説していきます。
タブで分ける
まずはタブで表示する方法です。
表示できるタブの数は最大3つです。4つ以上を選んでも全部表示されないのでご注意ください。
ちなみに設定画面の下にある「カードタイプ」で「縦型カード2列」を選択すると、上図のようになります。
この記事では「エントリーカード（デフォルト）」の前提で解説します。
カード（記事のリンクをカード型にしたもの）の見せ方はいろいろありますので、お好きな形に変更してみてくださいね。
スマホ表示を最適化
縦型またはタイルを選択した場合、そのままスマホで表示すると下図のように窮屈になってしまいます。
そのため上の図で「スマホ端末で縦型＆タイル型のエントリーカードを1カラムにする」をチェックしておきましょう！
カテゴリーで分ける
「カテゴリごと」を選択すると、こんなイメージになります。
「もっと見る」ボタンをクリックすると、カテゴリーの一覧ページに移動します。
カテゴリーを2カラムで表示する
「カテゴリごと（2カラム）」の場合はこちら。
2カラム（段落）で表示されます。
カテゴリーを3カラムで表示する
カラムが3つになります。
サイドバーを表示しているときは
サイドバーが表示されている状態で3カラムにすると、このようにレイアウトのバランスが悪くなります。
3カラムのときはサイドバーを非表示することをおすすめします。
細かい部分だけどユーザーのためには大事なんだよ。
サイドバーを非表示にしたいときは、「Cocoon設定」→「全体」→「サイドバーの表示状態」から変更できます。
カテゴリーの順番を変える
カテゴリーの表示順を変えることもできます。
その前にカテゴリーのIDを控えておく必要があります。
（1）ダッシュボードで「投稿」→「カテゴリー」をクリックします。
（2）カテゴリーの一覧が表示されるので、調べたいカテゴリーの名前の上にマウスカーソルを乗せます。
（3）ブラウザの下にURLが表示されます。
そこに「ID=XX」の文字が見えるので、そこに書かれている数字を控えておきましょう。
（4）Cocoon設定の「インデックス」に戻り、表示カテゴリーの下にある「カテゴリ表示の順番を並び替える場合はこちら」をクリックすると、その下に入力エリアが表示されます。
（5）先ほど控えたカテゴリーのIDを、カンマで区切って入力したら「変更をまとめて保存」しましょう。
変更前後のイメージがこちらです。
WordPressのテーマCocoonは万能
今回はWordPressの無料テーマCocoonで、トップページをカスタマイズする方法をご紹介しました。
Cocoonにはこのように、とても簡単にカスタマイズする機能が豊富です。
他にも様々な機能があるので、随時ご紹介していこうと思います。
ぜひ読者のみなさんも、いろいろと試してみてください！
■WordPressを使ったブログの始め方
コメント