WordPressの投稿記事の一覧を表示させる方法

WordPressの投稿記事の一覧を表示させるサンプルコード

下記は、記事のリンク・年月日・タイトルを表示するサンプルコードです。

コピペですぐに使用できるかと思います。

やっていることは、ページへのリンクと投稿日と投稿タイトルを3件分表示させたい時に、使用できます。

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

<?php if($the_query->have_posts()):?>
  <?php while($the_query->have_posts()):?>
    <?php $the_query->the_post();?>
    <a href="<?php the_permalink(); ?>">
      <div><?php the_time('Y.m.d');?></div>
      <div><?php the_title() ;?></div>
    </a>
  <?php endwhile;?>
<?php endif;?>
<?php wp_reset_postdata();?>

投稿一覧のリンク・年月日・タイトルを表示するサンプルコードの解説

‘posts_per_page’ => 3が、記事の表示件数を制御しています。

the_permalink();が、記事のリンクを表示しております。

the_time(‘Y.m.d’);が、記事の作成年月日を表示しております。

the_title();が、記事のタイトルを表示しております。

投稿記事のアイキャッチやカテゴリーを表示させるサンプルコード

下記は、最初のサンプルコードに加えて、アイキャッチやカテゴリーも表示させるためのサンプルコードです。

<?php
  $args = array(
  'post_type' => 'post',
  'posts_per_page' => 5
  );
  $query = new WP_Query( $args );
?>
<?php if( $query->have_posts() ) : ?>
  <?php while ( $query->have_posts() ) : $query->the_post(); ?>
    <a href="<?php the_permalink(); ?>">
      <div>
        <h2 class="title"><?php the_title(); ?></h2>
        <p class="excerpt"><?php echo get_the_excerpt(); ?></p>
        <time class="time"><?php the_time('Y年m月d日'); ?></time>
      </div>
      <?php
        if(has_post_thumbnail()):
          the_post_thumbnail();
        else:
      ?>
        <img class="test-img" src="<?php echo get_template_directory_uri(); ?>/img/test.jpg" alt="">
      <?php endif; ?>
      <div class="category">
        <?php
          $categories = get_the_category();
          if ( $categories ) {
            echo $categories[0]->name;
            }
        ?>
      </div>
    </a>
  <?php endwhile; wp_reset_postdata(); ?>
<?php else : ?>
  <p>記事が見つかりませんでした。</p>
<?php endif; ?>
<!-- /wp:heading -->

投稿一覧のアイキャッチやカテゴリーを表示するサンプルコードの解説

‘posts_per_page’ => 5が、記事の表示件数を制御しています。

the_permalink();が、記事のリンクを表示しております。

the_title();が、記事のタイトルを表示しております。

get_the_excerpt();が、抜粋文を文字列で取得できる関数です。

the_time(‘Y年m月d日’);が、記事の作成年月日を表示しております。

has_post_thumbnail();が、アイキャッチ画像が指定されているかのを判定しております。

the_post_thumbnail();が、アイキャッチ画像を表示させております。

get_template_directory_uri();が、テーマディレクトリまでのURLを取得しております。

get_the_category();が、投稿データのカテゴリー情報を取得しております。