［WP覚書］記事内の一番最初の画像を取得してサムネイル画像表示

2013年1月24日

今までfoodialyのテンプレートでその恩恵を受けてたのですが、結構スタンダードなやり方みたいです。
これだとアフィリエイト画像も取得してくれるので超便利！(*´∀｀*)

こちらのサイトをそのまま参考にさせて頂きました。ありがとうございます。
記事内の一番最初の画像を取得してサムネイル画像表示 | 簡単ホームページ作成支援-Detaramehp

functions.phpに以下を追加

<?php
function catch_that_image() {
    global $post, $posts;
    $first_img = '';
    ob_start();
    ob_end_clean();
    $output = preg_match_all('/<img.+src=&#91;\'"&#93;(&#91;^\'"&#93;+)&#91;\'"&#93;.*>/i', $post->post_content, $matches);
    $first_img = $matches [1] [0];
 
if(empty($first_img)){ //Defines a default image
        $first_img = "http://detarame.moo.jp/wp/wp-content/themes/whbk5/images/default.jpg";
    }
    return $first_img;
}
?>

http://detarame.moo.jp/wp/wp-content/themes/whbk5/images/default.jpg
は、Noimageの画像ですので、各自用意してリンク先を設定すること。

表示させたい部分に以下を表示

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

画像の大きさを揃えるためのCSS

※画像が欠けても画像の大きさを揃えたい場合

.memberbox {
	width:131px;
	height: 185px;
	float:left;
	overflow: hidden;
}

※画像を全て見せたい場合

.memberbox {
	width:131px;
	height: auto
	float:left;
}

あくまで自分流の方法ですが。
元々の仕様は元画像を縮小して見せてる設定ですが、
本来はサムネイルとして切り抜く方法が正しい方法だと思います。

[Wordpress]記事の最初の図を自動的にサムネイル化する方法 – Mami Press – 好きなこといろいろ

WordPress

Posted by ponnao