memocarilog

アイキャッチではなく、投稿記事内の画像を使用してサムネイルとしてトップページやサイドバー等に表示する方法です。調べていたら色々方法がありましたので、書き出してみました。

get_postsタグを使用してサムネイルを表示する

get_postsを使用して投稿記事の添付画像を取得し表示する方法です。
下記のコード表示したい箇所に記入します。このコードでサムネイルサイズ（150px × 150px）のサイズの画像を表示します。

<?php
$args = array(
	'post_type' => 'attachment',
	'posts_per_page' => 1,
	'post_status' => null,
	'post_parent' => $post->ID
	); 
$attachments = get_posts($args);
if ($attachments) {
	foreach ($attachments as $attachment) {
		echo the_attachment_link($attachment->ID, false);
	}
}
?>

”the_attachment_link($attachment->ID, false”の箇所のthe_attachment_linkの第二引数にサムネイルのサイズを指定できるはずなのですが、’medium’を設定すると’full’のサイズが表示されてしまいうまくサイズの指定ができませんでした。

get_childrenタグを使用してサムネイルを表示する

get_childrenタグを使用して投稿記事の添付画像を取得し表示する方法です。
下記のコード表示したい箇所に記入します。

<?php
$files = get_children("post_parent=$id&post_type=attachment&post_mime_type=image");
if (!empty($files)){
$keys = array_keys($files);
$num=$keys[0];
$thumb=wp_get_attachment_thumb_url($num);
print '<a href="' . clean_url(get_permalink()) . '" title="' .
the_title_attribute('echo=0') . '"><img src="' . clean_url($thumb) .
'" width="100" height="100" alt="' . the_title_attribute('echo=0') . '" /></a>' . "\n";
}
?>

　　　

img srcの記述を拾って画像を取得し表示する

投稿記事内のimgタグを探して画像を取得し表示する方法です。投稿記事内の画像を取得するので、添付ファイルがない場合でもサムネイルとして表示してくれるので、このブログのサイドに表示している最近の投稿記事一覧のサムネイルはこちらの方法で表示しました。

function.phpで下記の関数を記入します。

function catch_that_image() {
	global $post, $posts;
	$first_img = '';
	ob_start();
	ob_end_clean();
	$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
	$first_img = $matches [1] [0];

	if(empty($first_img)){ //Defines a default image
    	$first_img = "/images/default.jpg";
	}
return $first_img;
}

　　
表示したい箇所に下記を記入します。

<img src="<?php echo catch_that_image(); ?>" alt="" width="" height="" />; ?>

このままだと記事内の画像が強制的にサイズが指定されるので横に伸びてしまったりします。私は画像サイズの横幅のみ指定し、CSS側でサムネイルを表示する親ボックスに縦サイズを指定して、overflow:hiddenにしました。

プラグインでサムネイルを表示する

WordPress › QF-GetThumb « WordPress Plugins というプラグインでサムネイルを生成できるようです。