WordPress 記事一覧で複数サムネイルを表示する-phpカスタマイズ-

WordPressのトップページやアーカイブ一覧ページで各記事を並べる際に、サムネイルを表示させることは多々あると思います。WoedPressのバージョンが3.xになってからは比較的簡単に設置することができます。

たとえば以下の記述で1枚のサムネイル画像を読み込むことができます。（※アイキャッチに設定が必要です！）

アイキャッチのサムネイル画像を読み込む

<?php the_post_thumbnail(array(135,135), array('class' => 'left')); ?>

さらに下記のように、複数のサムネイルを最大枚数枚数を指定して読み込むことをやってみました。

以下にソースを記述します。ご参考にしてください。

<?php while (have_posts()) : the_post(); ?>

<div class="post clearfloat">
<h3 class="title"><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h3>
<span class=cat_title><?php the_category(', '); ?> &raquo </span>
<div class="spoiler">
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>">
<?php the_post_thumbnail(array(135,135), array('class' => 'left')); ?>
</a>
<?php echo mb_substr(strip_tags($post-> post_content), 0, 100); ?>...<br />

<a href="<?php the_permalink() ?>" class="thum-mini">
<?php
$images = get_children( array(
  'post_parent' => get_the_ID(),
  'post_type' => 'attachment',
  'post_mime_type' => 'image',
  'orderby' => 'menu_order',
  'order' => 'ASC',
) );

$i=0;
foreach ( (array) $images as $attachment_id => $attachment ) {
  $src = wp_get_attachment_image_src( $attachment_id, 'thumbnail' );
  echo '<img width="80" height="80" src="' . $src[0] . '" />';
if (3<$i){
break;
}
$i++;
}
?>
</a>
<br />
<a href="<?php the_permalink(); ?>" class="more-link w-right" title="<?php the_title(); ?>"><span>▼画像を全部見る</span></a>

</div>
</div>
<?php endwhile; ?>

部分解説

<?php the_post_thumbnail(array(135,135), array('class' => 'left')); ?>

は、アイキャッチで設定した画像をサイズ、スタイルを指定して読み込んでいます。

<?php echo mb_substr(strip_tags($post-> post_content), 0, 100); ?>...<br />

は、記事の内容を最大文字数を指定しています。

$images = get_children( array(
  'post_parent' => get_the_ID(),
  'post_type' => 'attachment',
  'post_mime_type' => 'image',
  'orderby' => 'menu_order',
  'order' => 'ASC',
) );

は、よくわかっていませんが、読み込む情報の条件を指定しているようです。ここでは画像である条件をしていると思います。

wp_get_attachment_image_src()

は、画像を取得する関数です。

foreach ( (array) $images as $attachment_id => $attachment ) {
  $src = wp_get_attachment_image_src( $attachment_id, 'thumbnail' );
  echo '<img width="80" height="80" src="' . $src[0] . '" />';

は、読み込んだ画像を繰り返して出力しています。たぶん。
そして、foreach関数だけでは繰り返す回数を指定できないようでしたので、for文で回数を指定します。

$i=0;
/* 実行内容（上記のforeach関数が入ります。） */
if (3<$i){
break;
}
$i++;
}

は、変数”$i”が”4″になったらbreak（停止）します。”0”からカウントしているので、5回繰り返しています。

これで最大5枚のサムネイルが出力されます。