カテゴリーページを記事タイトル一覧で全件表示する

カテゴリーページを記事タイトル一覧にし全件表示するWordPressのカテゴリーページについて、多くの場合ではデフォルトテーマでのトップページと同様に、タイトル記事の抜粋が表示されると思います。

トップページでは、この表示方法でいいかもしれませんが、カテゴリーページではタイトルのみを表示し、目次みたいな感じにしたくなることもあると思います。
この画像のような表示方法です。
ってことで、カテゴリーページをカスタマイズしてみました!
今回のカスタマイズはWordPressデフォルトテーマのTwenty Elevenにて行いました。もちろん、他のテーマでも同様のことができます。

ループ部分を編集しタイトルのみの表示とする

category.phpのループ部分を編集します。
※ もし、category.phpが存在しないテーマであれば、index.phpをコピーするなりしてcategory.phpを作成します。

タイトルをリスト表示としたいので、ループ部分を囲うようにしてulタグを記述します。<ul>
(ループ部分)
</ul>
Twenty Elevenであれば、
  • <ul>:<?php while ( have_posts() ) : the_post(); ?>の手前
  • </ul>:<?php endwhile; ?>の後
上記の位置にそれぞれを記述します。

そして、ループ内の記述を<li><?php the_time('Y/m/d'); ?>・・・<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>この一行のみにします。

これでループ内での出力がタイトルと日付のみになり、さらにそれらがリスト表示されるようになりました。

すべての投稿が表示されるようにする

カテゴリーページを開いたときに、表示されるタイトル数(記事数)は、ダッシュボードでの表示設定で指定した数となります。
表示設定での指定数で問題がなければいいのですが、カテゴリーページではタイトルのみの表示となったので、全件表示をしたい人も多いと思います。

とても簡単にできます!

ループ部分の少し前に<?php if ( have_posts() ) : ?>という記述があると思いますがこれを<?php if ( have_posts() ) : query_posts($query_string.'&posts_per_page=-1'); ?>とするだけです。

posts_per_pageが表示記事数を指定しているのですが、これを-1とすると全件表示となります。


これでカテゴリーページが大変身しました。
ブログサイトではないサイトを作る時にも、かなり使えそうなカスタマイズだと思います。
WordPressをどんどん便利にカスタマイズしましょう!


関連記事

WordPressの画像を連続で投稿に挿入する 連続で画像を投稿に挿入
WordPressにて何枚もの画像を連続で挿入したい時があります。メディアを追加ウィンドウを自動で閉じないカスタマイズを紹介します。
WordPressで関連記事一覧を表示する方法 WordPressで関連記事を一覧表示する
WordPressなどで記事の隅っこによく見かける関連記事の一覧。プラグインを使用せずに実装する方法を紹介します。
WordPressでの子ページの作り方 固定ページを階層化し親ページに子ページ一覧を表示
WordPressの固定ページを階層化し、親ページに子ページの一覧を表示する方法を紹介します。プラグイン不使用です。
アイキャッチ画像の上に半透明の帯と記事タイトルをテキスト表示 画像の上に半透明の帯とテキストを表示
最近よく見かける、画像の上に半透明の帯を表示しテキストを配置する方法。簡単なCSSで実現できますのでお勧めです。
WordPressの固定ページや投稿記事に個別にcssを追加する 固定ページや投稿記事ごとに個別のCSSとJavaScriptを追加
WordPressテーマのスタイルシートとは別に、記事やページごとに追加指定したいcssがある場合には、function.phpをカスタマイズすれば可能となります。JavaScriptも同様に可能です。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>