Blog スタッフブログ

[WORDPRESS]投稿した最初の画像を取得してTOPページに表示する方法

こんにちは、WEB開発の米田です。
今回は投稿した最初の画像を取得してTOPページに表示する方法をお伝えします。

例えばお知らせの投稿などでTOPページに投稿した画像をサムネイルとして使えるコードになります。

まずはfunction.phpにこちらを入れます。

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

そしてTOPページまたは投稿ページでサムネイルを表示させたいところにこちらを入れます。

<?php if(first_image()): ?>
    <img class="img-responsive" src="<?php echo first_image(); ?>" alt="<?php the_title(); ?>">
        <?php else : ?>
           <img class="img-responsive" src="<?php echo get_template_directory_uri(); ?>/images/no_image.png<?php echo my_get_filetime('/images/no_image.png');?>" alt="<?php esc_html(bloginfo('name')); ?>">
 <?php endif; ?>

こちらを入れていただければ投稿ページの最初の画像がサムネイルとして表示されます。

戻る 一覧へ戻る