【WordPress】アイキャッチのかわりに記事内最初の画像を表示、もし記事内に画像がなかったらnoimage画像を表示する方法

WordPressで投稿するとき、アイキャッチ画像を設定するのを忘れたり、特にアイキャッチ画像を指定する必要もないなー(めんどくさいだけ)っていう、そんなこともたまにはある。

アイキャッチがない時、記事内にある画像を表示したい。
さらに、記事内に画像がなかったらnoimage画像表示してほしいなー。
ということで調べてみた。
そのメモをコピペでいける仕様で記載しておく。

functions.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)){
		// 記事内で画像がなかった場合のnoimage画像指定
		$first_img = esc_url(get_template_directory_uri()) . "/images/common/noimg.png";
	}

	return $first_img;
}

記事一覧のテンプレートに記載するコード

<img src="<?php echo catch_that_image(); ?>" alt="<?php the_title(); ?>">

参考にさせてもらったサイト

とてもわかりやすく、参考になりました!ありがとうございます。

WordPressで記事内の一番目の画像をアイキャッチ代わりに使用する

ABOUT US
yukipan
Web制作会社で働いてます。パンダとかリラックマとか、まあるいものが好き。好奇心旺盛で、何にでも興味をもってしまう。とりあえずやってみてから取捨選択するのがモットー。今はグリーンカレーとチャイと株式投資がブーム。