1. HOME
  2. ブログ
  3. WordPress 特定カテゴリーの記事を指定件数分表示する

WordPress 特定カテゴリーの記事を指定件数分表示する

たくさん方法がある中で今回とっても参考になった(というかマルマル使わせてもらった)記事があり、あっさりできたので、備忘録として残しておきます。

ブログページ以外にも、投稿記事を表示させたい場合はよくあります。
たとえば、トップページに新着記事とか
ニュースページに投稿記事のカテゴリ”ニュース”のみとか。

カスタム投稿タイプを作成する方法も考えたのですが、なんかいまいち理解しきれていないようで断念。

 

今回は、

・固定ページのテンプレートを追加で作成して、

そのテンプレートに、

・投稿記事のカテゴリが”販売”で

・最新記事5件を

・アイキャッチ画像もキレイに並べて

・一覧表示させる

っていうのをやりました。

テンプレートの作成

まずは、固定ページのテンプレート作成

もともとある、page.phpをダウンロードし、page-second.phpとファイル名を変更。

page-second.phpの一番上に、

[html]
<!–?php /* Template Name: page-second(任意の名前) */ ?–>
[/html]

とする

このファイルを子テーマフォルダに入れる

※page.phpと同じ階層においてもいいけど、改版が多いテンプレートのため子テーマを作っていたので。

固定ページの作成

管理画面から固定ページを新規作成し、テンプレートに先ほど作成した、page-secondを指定する

固定ページに投稿記事を表示させる

page-second.phpを開き、以下を追加
※表示させる投稿数やカテゴリIDは変更してみてください。以下だと6行目あたり

[html]
<?php //———————————— 最新の投稿 10件 ————————————開始 ?>
<table><tr><td>
<?php dynamic_content_gallery(); ?>
<h2 class="pagetitle">新着 10件</h2>

<?php query_posts(‘showposts=10&posts_per_page=-1&cat=-7′); ?>

<?php while (have_posts()) : the_post(); ?>

<?php
// アイキャッチ画像取得 開始
$thumb = get_the_post_thumbnail($post->ID,’thumbnail’);
$pattern= "/(?<=src=[‘|\"])[^’|\"]*?(?=[‘|\"])/i";
preg_match($pattern, $thumb, $thePath);
$theSrc = $thePath[0];
// アイキャッチ画像取得 終了
?>

<?php
// このカテゴリーへのリンクを取得 Start
// このカテゴリーの URL を取得
$category_link = get_category_link( $category_id );

// このカテゴリーへのリンクを取得 End
?>

<ul>
<div class="entry">
<img src="<?php echo $theSrc; ?>" class="alignleft post_thumbnail wp-post-image" width="10%" alt="アイキャッチ" />
<h1 class="title"> <a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>

<?php //記事の本文を指定文字数取得する ?>
<p><?php echo strip_tags(mb_substr($post->post_content, 0, 120)); ?>….</p>

<!– このカテゴリーへのリンクを出力 続きを見る –>
<div class="readmorecontent">
<a class="readmore" href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title(); ?>">Read More &raquo;</a>
</div>
<hr>
</div>
</ul>
<?php endwhile;?>

<?php wp_reset_query(); ?>
</td></tr></table>
<?php //———————————— 最新の投稿 10件 ————————————終了 ?>
[/html]

微調整

アイキャッチの画像が小さいな、と思ったら29行目あたらいの%の数値を変更

こんな感じにできました!

無題

参考サイト:WordPressの固定ページに新着情報とか表示する.

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

関連記事