WordPressで記事一覧を表示させる方法

よく使うWordPress記事一覧取得コード雛型

メインループ

<?php // メインループ ?>
<?php
$paged = get_query_var('paged') ? get_query_var('paged') : 1 ;
$args = array(
    'posts_per_page' => 10,     // 1ページの表示数
    'paged' => $paged,          // ページネーション使用
    'ignore_sticky_posts' => 1, // 先頭に固定表示無効（定位置で表示）
);
query_posts($args);
?>
<section class="main_loop">
<div class="inner">
<h1>メインループ</h1>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : ?>
<?php the_post(); ?>
 
<a class="link" href="<?php the_permalink(); ?>">
<h2><?php the_title(); ?></h2>
<p class="post-date"><?php the_time('Y年m月d日') ?></p>
<p class="modified-date"><?php the_modified_date('Y年m月d日') ?></p>
</a>
 
<?php endwhile; ?>
<?php else: ?>
<div class="nodata">記事が存在しません</div>
<?php endif; ?>
</div><!-- /.inner -->
</section><!-- /.main_loop -->

サブループ

投稿に対する関連カテゴリ一覧等に使用するサブループ

<?php // サブループ ?>
<?php
//取得記事の条件
$category_name = 'other';
$args = array(
  'posts_per_page' => 5,             // 1ページの表示数
  'category_name' => $category_name, // カテゴリースラッグ指定
  'ignore_sticky_posts' => 1,        // 先頭に固定表示無効（定位置で表示）
);
$the_query = new WP_Query($args);
?>
<?php if($the_query->have_posts()) : ?>
 
<section class="sub_loop">
<div class="inner">
<h1>サブループ：<?php echo $category_name; ?></h1>
<?php while($the_query->have_posts()): ?>
<?php $the_query->the_post(); ?>
 
<a href="<?php the_permalink(); ?>">
<h2><?php the_title(); ?></h2>
<p class="post-date"><?php the_time('Y年m月d日') ?></p>
<p class="modified-date"><?php the_modified_date('Y年m月d日') ?></p>
</a>
 
<?php endwhile; ?>
</div><!-- /.inner -->
</section><!-- /.sub_loop -->
<?php endif; ?>
<?php wp_reset_postdata(); ?>

先頭に固定表示用サブループ

<?php // 先頭固定表示サブループ ?>
<?php if (get_query_var('paged')<2): ?>
<?php
$sticky = get_option( 'sticky_posts' );
$posts_count = 0; // 表示記事カウント変数

$posts_per_page = 5; // 1ページの表示数
$args = array(
    'post_type' => 'post',
    'post__in' => $sticky, // 先頭に固定表示のみ表示
    'orderby' => 'date', // 日付で並び替え
    'order' => 'DESC', // 降順（新しい順）
);
$the_query = new WP_Query($args);
?>
<?php if ($sticky) : ?>
<?php if($the_query->have_posts()) : ?>
  
<section class="sticky_loop">
<div class="inner">
<h1>先頭固定表示サブループ</h1>
<?php while ($the_query->have_posts()) : ?>
<?php $posts_count++; ?>
<?php if ($posts_count > $posts_per_page) break; ?>
<?php $the_query->the_post(); ?>
  
<a class="link" href="<?php the_permalink(); ?>">
<h2><?php the_title(); ?></h2>
<p class="post-date"><?php the_time('Y年m月d日') ?></p>
<p class="modified-date"><?php the_modified_date('Y年m月d日') ?></p>
</a>
  
<?php endwhile; ?>
</div><!-- /.inner -->
</section><!-- /.sticky_loop -->
  
<?php endif; ?>
<?php endif; ?>
<?php endif; ?>
<?php wp_reset_postdata(); ?>

投稿詳細で同タグ最新記事一覧表示用サブループ

single.phpに記述

<?php // 同タグ最新記事表示 ?>
<?php if (has_tag()) : ?>
<?php
$p_id[] = get_the_ID(); // 現在表示記事ID取得
$currentTagList = get_the_tags(); // 現在表示記事タグ一覧取得
for ($num=0; $num < count($currentTagList); $num++) :
    $args = array(
        'posts_per_page' => 3,
        'post__not_in' => $p_id, // 現在表示記事除外
        'tag_id' => $currentTagList[$num]->term_id, // 現在表示記事タグ指定
        'orderby' => 'date',
        'order' => 'DESC',
    );
    $the_query = new WP_Query($args);
?>
<?php if($the_query->have_posts()) : ?>
<section class="sub_loop">
<div class="inner">
<h1>関連記事：<?php echo $currentTagList[$num]->name; ?></h1>
<?php while($the_query->have_posts()): ?>
<?php $the_query->the_post(); ?>
 
<a class="link" href="<?php the_permalink(); ?>">
<h2><?php the_title(); ?></h2>
<p class="post-date"><?php the_time('Y年m月d日') ?></p>
<p class="modified-date"><?php the_modified_date('Y年m月d日') ?></p>
</a>
 
<?php endwhile; ?>
<div class="archive_link">
<a href="<?php echo esc_url(get_stylesheet_directory_uri()) . '/tag/' . $currentTagList[$num]->slug; ?>"><?php echo $currentTagList[$num]->name; ?>をもっと見る</a>
</div><!-- /.archive_link -->
</div><!-- /.inner -->
</section><!-- /.sub_loop -->
<?php endif; ?>
<?php wp_reset_postdata(); ?>
<?php endfor; ?>
<?php endif; ?>

投稿詳細で同カテゴリ最新記事一覧表示用サブループ

single.phpに記述

<?php // 同カテゴリ最新記事表示 ?>
<?php
$p_id[] = get_the_ID(); // 現在表示記事ID取得
$currentCatList = get_the_category(); // 現在表示記事カテゴリ一覧取得
for ($num=0; $num < count($currentCatList); $num++) :
    $args = array(
        'posts_per_page' => 3,
        'post__not_in' => $p_id, // 現在表示記事除外
        'cat' => $currentCatList[$num]->cat_ID, // 現在表示記事カテゴリ指定
        'orderby' => 'date',
        'order' => 'DESC',
    );
    $the_query = new WP_Query($args);
?>
 
<?php if($the_query->have_posts()) : ?>
<section class="sub_loop">
<div class="inner">
<h1>関連記事：<?php echo $currentCatList[$num]->cat_name; ?></h1>
<?php while($the_query->have_posts()): ?>
<?php $the_query->the_post(); ?>
 
<a class="link" href="<?php the_permalink(); ?>">
<h2><?php the_title(); ?></h2>
<p class="post-date"><?php the_time('Y年m月d日') ?></p>
<p class="modified-date"><?php the_modified_date('Y年m月d日') ?></p>
</a>
 
<?php endwhile; ?>
<div class="archive_link">
<a href="<?php echo esc_url(get_stylesheet_directory_uri()) . '/category/' . $currentCatList[$num]->slug; ?>"><?php echo $currentCatList[$num]->cat_name; ?>コンテンツをもっと見る</a>
</div><!-- /.archive_link -->
</div><!-- /.inner -->
</section><!-- /.sub_loop -->
<?php endif; ?>
<?php wp_reset_postdata(); ?>
<?php endfor; ?>