ITの隊長のブログ

ITの隊長のブログです。Rubyを使って仕事しています。最近も色々やっているお(^ω^ = ^ω^)

WordPressで投稿記事のリストを表示するために必要なことをメモ

スポンサードリンク

http://www.flickr.com/photos/71813425@N00/2913018697
photo by Peregrino Will Reign


もう何度も探して -> 組み立てて -> バグって -> 調べて -> 修正 -> 時がたち忘れる。ってのをやりたくないのでメモ。


WordPressのバージョンは4.1です。



<?php
  /**
   * showposts=3 -> 記事の表示を3つまでにする
   * もし上限を設けたくなければ、この記述は空っぽにしてくださ
   * query_posts() って感じで
   */
  query_posts('showposts=3');
  // ループスタート
  if ( have_posts() ) : while ( have_posts() ) : the_post();
?>
<div class="image"><?php
  //アイキャッチ画像を表示
  if(has_post_thumbnail()) {

    //アイキャッチ画像が設定されていない場合に記事の最初の画像を表示する。
    the_post_thumbnail('thumbnail');

  } else {
    /**
     * wp-image-(ポストid)って形式で投稿されるらしいので
     * 置換して、$thumbに格納
     */
    preg_match('/wp-image-(d+)/s' , $post->post_content, $thumb);

    // 入っていれば表示
    if($thumb) {

      echo wp_get_attachment_image($thumb[1], 'thumbnail');

    } else {

      // それでも見つからない場合はデフォルト画像を表示する
      echo '<img src="'. get_template_directory_uri() .'/img/common/no-img.jpg" />';

    }

  }
?></div>
<p class="date"><?php /* 投稿した記事の時間を表示(年月日) */ the_time('Y.n.j'); ?></p>
<p class="title"><?php

  // タイトルの文字数が20文字を切った場合は...と表示するようにする
  if(mb_strlen($post->post_title)>20) {

    $title = mb_substr($post->post_title,0,20);
    echo $title . ・・・ ;

  } else {

    echo $post->post_title;

  }
?></p>

<p class="excerpt"><?php

  // 投稿の省略内容を表示。24文字以上であれば...と表示するようする
  if (mb_strlen($post->excerpt) > 24) {

    $this_excerpt = mb_substr(get_the_excerpt(), 0, 24);
    echo $this_excerpt . ・・・ ;

  } else {

    echo $post->excerpt;

  }
?></p>

<p class="more"><a href="<?php /* 投稿記事のリンクを表示 */ the_permalink(); ?>">もっと読む</a></p>

<?php endwhile; else: ?>

<p><?php /* 記事が存在しない場合はこの内容を表示 */ _e('Sorry, no posts matched your criteria.');?></p>

<?php endif; ?>


この内容を自分で作ったクラスで囲むなり、ul の li で囲むなりしてください。(ループの中に入れてね。)


あと、htmlと挟むとあんまりキレイに見えないねぇ―(´・ω・)


おわり