WordPress ループと投稿タイトルの表示

  Code Tips minimum Theme

投稿したタイトルを新着順に出力してみます。
確認用に管理画面から10投稿程度テスト投稿しておきます。

 

the_title()を使って投稿タイトルを出力

the_title() を使って投稿タイトルを表示してみます。

現在の投稿のタイトルを表示、あるいは返します。必ずループの中で使用してください。ループの外では get_the_title() を使います。 投稿の公開状態がパスワード保護(protected)や非公開(private)であった場合、”Protected: ” や “Private: ” といった注釈がタイトルの前に追加されます。

WordPress Codex : テンプレートタグ/the title

 

the_title('before', 'after', display)

 

位置

ループ内

 

パラメータ
引数 説明
$before
文字列
オプション
タイトルの直前に出力するコードやテキスト。
初期値: なし
$after
文字列
オプション
タイトルの直後に出力するコードやテキスト。
初期値: なし
$display
真偽値
オプション
取得した値の処理方法。
true(デフォルト。タイトルをページ内に出力)
false(PHPで使用できる値としてタイトルを返す)
初期値:true

 

位置はループ内とあるのでループの中に配置してみます。
while の前に if ( have_posts () )  を置いて該当する投稿がある場合にループを開始するようにします。
※ここではわかりやすいように「while文」の例題によく出てくる {} を使った while (条件) {~} の形式で書いています。

<body>
~ 省略 ~
<?php
  if (have_posts()) {
    while (have_posts()) {
      the_post();
      the_title('<h2>','</h2>');
    }
  }
?>
</body>

 

保存してブラウザで確認すると最新の投稿のタイトル10件が表示されます。
※.管理画面の「設定」>「表示設定」の「1ページに表示する最大投稿数」で設定した件数が表示されます。

 

ループの動作

ループの動作を追ってみます。

<?php
  if (have_posts()) {
    while (have_posts()) {
      the_post();
      the_title('<h2>','</h2>');
    }
  }
?>

 

if (have_posts())

条件分岐「if文」の条件に have_posts() が入っているので、投稿があれば以降の「while文」を実行します。

have_posts() は現在の WordPress クエリにループできる結果があるかどうかをチェックします。ブール型関数で、true または false を返します。

WordPress Codex : 関数リファレンス/have posts

 

while (have_posts())

whileの条件式にも have_posts() が入っているので「条件を満たす投稿がある」限りループを繰り返します。

 

the_post()

while 文の例題によく出てくる $count++ のような動作をします。

ループを次の投稿へ進めます。 次の投稿を取得して、それを「現在の投稿」としてセットアップし、ループの 'in the loop' プロパティを true にします。

WordPress Codex : 関数リファレンス/the post

 

the_title(‘<h2>’,'</h2>’)

ループの中の the_title() で新着順にタイトルを出力します。
引数に '<h2>','</h2>' を渡してタイトルを <h2> タグで囲んで出力します。

 

ここまでではループの動作がわかりやすいように「if文、while文」を {} を使った形式で書いていましたが、WordPressのテーマファイルでは {} ではなく、 :  を使った書き方のほうが扱いやすいのでそれに書き換えてみます。

<?php
  if (have_posts()) :
    while (have_posts()) :
      the_post();
      the_title('<h2>','</h2>');
    endwhile;
  endif;
?>

 

さらに <?php ~ ?> を複数ブロックに分割します。

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php the_title('<h2>','</h2>'); ?>
<?php endwhile; ?>
<?php endif; ?>

 

Code Tips minimum Theme

【index.php】

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
  <meta charset="<?php bloginfo( 'charset' ); ?>">
  <title><?php wp_title('|', true, 'right'); ?><?php bloginfo('name'); ?></title>
  <?php wp_head(); ?>
</head>
<body>
  <h1><a href="<?php bloginfo('url'); ?>/"><?php bloginfo('name'); ?></a></h1>
  <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

  <?php the_title('<h2>','</h2>'); ?>

  <?php endwhile; ?>
  <?php endif; ?>
</body>
</html>