ワードプレスの全記事を一覧表示

ワードプレスに投稿された全記事を一覧で表示するやり方です。

固定ページを作成

全記事一覧を表示させる固定ページを作成しましょう。
category.phpやpage.phpをコピーし、『スラッグ名（以下、○○と表記）-page.php』とリネームしてください。
このようにすれば、該当するページを表示する際に、page.phpではなく、○○-page.phpを読み込んでくれます。

固定ページにテンプレートを指定するやり方でもOK

RU DESIGN

2020.09.22

固定ページをテンプレートで選択し任意のデザインに変更

https://ru-design.work/tutorial/post-658

固定ページを新規に作成する際に、デフォルトで使用されるpage.php以外のテンプレートを用意することによって、固定ページ毎にデザインを適用することができます。 page.phpを複製新たに作ってもいいですが、テーマ内にあるpage.phpを複製しお好みのデザインに仕上げてみましょう。ファイル名はpage_○○.phpみたいな感じにしておくと後で分かりやすいと思います。page-○○.phpのようにすると、1つのページにのみ適用することを目的とした特殊なテンプレートとして解釈されるため注意してください。ちなみに、page-sample.phpとした...

○○-page.phpの編集

作成した○○-page.phpを編集します。
記事一覧を表示させます。

<?php
$args = array(
'post_type' => 'post',
'posts_per_page' => 10,
);
$my_query = new WP_Query($args);

if( $my_query -> have_posts() ) :
while($my_query -> have_posts()) : $my_query -> the_post();
?>
<!--ループの内容-->
<?php endwhile;else: ?>
<p>表示する記事がありません</p>
<?php endif; ?>
 <?php wp_reset_postdata(); ?>

上記だと、投稿された記事を10件表示させるだけです。
固定ページはひとつのページとしての役割があるため、このままではページネーションを機能させることはできません。

固定ページでページネーションを機能させる

先ほどの例にget_query_var(‘paged’)を追加してページ番号を取得しましょう。
これで、ページネーションを機能させられます。

<?php
$paged = get_query_var('paged') ? get_query_var('paged') : 1 ;
$args = array(
'post_type' => 'post',
'posts_per_page' => 10,
'paged' => $paged
);
$my_query = new WP_Query($args);

if( $my_query -> have_posts() ) :
while($my_query -> have_posts()) : $my_query -> the_post();
?>
<!--ループの内容-->
<?php endwhile;else: ?>
<p>表示する記事がありません</p>
<?php endif; ?>
 <?php wp_reset_postdata(); ?>

 
WP-PageNaviを使用している場合
以下のように書き換えてください。

<?php
    if(function_exists('wp_pagenavi')) {
        wp_pagenavi(array('query' => $my_query));
    }
?>

おまけ

投稿以外にカスタム投稿がある場合はpost_typeをこのように書き換えてください。

‘post_type’ => array(‘post’,’カスタム投稿のスラッグ名1′,’カスタム投稿のスラッグ名2′),

参考にどうぞ！

カスタム投稿の追加方法

RU DESIGN

2020.06.13

独自のカスタム投稿タイプを追加する方法

https://ru-design.work/tutorial/post-540

WordPressの通常の投稿と別に分けて記事を作成したい場合に便利な「カスタム投稿タイプ」。プラグイン でも機能を追加することができますが、テーマにちょっと記述するだけで簡単に使用することができます。自分が仕事でよくやるのは、通常の投稿はブログやお知らせなどで使用し、商品紹介やお店情報など別のコンテンツを書きたい場合にカスタム投稿を使用しています。目的によって投稿する場所を変えることによって更新し易くなります。 カスタム投稿の追加方法functions.phpに下記のように追加してください。/* ショップ投稿 */...

RU DESIGN

2020.06.15

カスタム投稿タイプの新着記事を表示

https://ru-design.work/tutorial/post-552

カスタム投稿をシングルページやサイドバーなどに表示する方法です。<ul><?php$args = array( 'post_type' => 'recruit', 'posts_per_page' => 12); ?><?php $my_query = new WP_Query( $args ); ?> <?php while ( $my_query->have_posts() ) : $my_query->the_post(); ?><li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li><?php endwhile; ?><?php wp_reset_postdata(); ?>&a...