code ดึงรูปแรกมาแสดง มันจะแสดงรูป original

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];

  return $first_img;
}

ต้องการให้แสดง medium size (ขนาด 300 x …)

ตอบ

When the first image is a WordPress image attachment. in 3.6, there is an easier way.

function get_first_image_medium_size_url($post_id) {

 if(!$images = get_attached_images($post_id))
    return false;
 $first_image = current($images);

 if(!$src = wp_get_attachment_image_src($first_image->ID,'medium'))
    return false;

 $medium_url = current($src);

 return $medium_url;
}

get_attached_images is available in 3.6.

wp_get_attachment_image_src is available since 2.5.0 which will automatically get or scale the image attachment to specified size.

Since the 3.6 isn’t released yet, you may want to create your own get_attached_images function

function my_get_attached_images( $post_id = 0 ) {
    $post = empty( $post_id ) ? get_post() : get_post( $post_id );
    if ( empty( $post ) )
        return;

    $args = array(
        'post_parent' => $post->ID,
        'post_type' => 'attachment',
        'post_mime_type' => 'image',
        'posts_per_page' => -1,
        'orderby' => 'menu_order',
        'order' => 'ASC',
    );


    $children = get_children( $args );

    return (array)$children;
}

What if the image isn’t a WordPress attachment type?

for example, you are linking to an flickr image.

Well, here is my version of catch_first_image

function get_first_image($content){
    if(!$content)
        return false;
    preg_match("@<img.+?src=[\"'](.+?)[\"'].+?>@",$content,$m);

    if($m[1])
        if(filter_var($m[1], FILTER_VALIDATE_URL))
            return $m[1];
    return false;
}

I think it is better than yours. Oftentimes, my heartbeat raises when I see the ob_* functions. hehe

How to resize the image?

I’d like to use WordPress Photon to do this thing.

function photon_image_url($orgin_url){
        $orgin_url = str_replace(array('http://','https://'),'',$origin_url);
        return 'http://i0.wp.com/'.$origin_url.'?w=50%';
}

note: this function is just to give you a general idea of how to use photon.

ตอบ

You will need to grab the image, get its ID, and then use wp_get_attachment_image to pick the appropriately sized image.

function first_image_medium_wpse_97658($content) {
  global $wpdb;
  $pattern = '|<img.*?src="([^"]+)".*?/>|';
  preg_match($pattern,$content,$matches);
  if (!empty($matches[1])) {
    $path = pathinfo($matches[1]);
    if (!empty($path['filename'])) {
      $id = $wpdb->get_var($wpdb->prepare("SELECT ID FROM {$wpdb->posts} WHERE post_name = %s",$path['filename']));
      if (!empty($id)) {
        $content = wp_get_attachment_image($id,'medium'); 
      }
    }
  }
  return $content;
}
add_filter('the_content','first_image_medium_wpse_97658');

And another version using the classes set on the image by default. This one has no extra database query but would fail if those classes are not set.

function first_image_medium_wpse_97658_v2($content) {
  $pattern = '|<img.*?class="([^"]+)".*?/>|';
  preg_match($pattern,$content,$matches);
  if (!empty($matches[1])) {
    $classes = explode(' ',$matches[1]);
    $id = preg_grep('|^wp-image-.*|',$classes);
    if (!empty($id)) {
      $id = str_replace('wp-image-','',$id);
      if (!empty($id)) {
        $id = reset($id);
        $content = wp_get_attachment_image($id,'medium');  
      }
    }
  }
  return $content;
}
add_filter('the_content','first_image_medium_wpse_97658_v2');

The function can also be called directly, without being used as a filter callback.

echo first_image_medium_wpse_97658_v2($post->post_content);

To replace the excerpt with the first image from the content requires a minor change. The the_excerpt filter is passed content like the the_content filter but there is no guarantee that the _post_content_ images will be in there.

function first_image_medium_wpse_97658_v3($excerpt) {
  global $post;
  $content = $post->post_content;
  $pattern = '|<img.*?class="([^"]+)".*?/>|';
  preg_match($pattern,$content,$matches);
  if (!empty($matches[1])) {
    $classes = explode(' ',$matches[1]);
    $id = preg_grep('|^wp-image-.*|',$classes);
    if (!empty($id)) {
      $id = str_replace('wp-image-','',$id);
      if (!empty($id)) {
        $id = reset($id);
        $excerpt = wp_get_attachment_image($id,'medium');  
      }
    }
  }
  return $excerpt;
}
add_filter('the_excerpt','first_image_medium_wpse_97658_v3',100);

I also added a priority to the callback so that the filter runs late, hopefully after other filters so that the the_excerpt is completely replaced by the filter output.

ตอบ

Get’s First image Width = 100px Height = 80px

<?php
function getImage10080($num) {
global $more;
$more = 1;
$link = get_permalink();
$content = get_the_content();
$count = substr_count($content, '<img');
$start = 0;
for($i=1;$i<=$count;$i++) {
$imgBeg = strpos($content, '<img', $start);
$post = substr($content, $imgBeg);
$imgEnd = strpos($post, '>');
$postOutput = substr($post, 0, $imgEnd+1);
$postOutput = preg_replace('/width="([0-9]*)" height="([0-9]*)"/', '/width="100px" height="80px"/',$postOutput);
$image[$i] = $postOutput;
$start=$imgEnd+1;
}
if(stristr($image[$num],'<img')) { echo ''.$image[$num].""; }
$more = 0;
};
?>

After placing this code in your functions.php (without ) you’ll only have to write this:

<?php getImage10080('1');?>

where you want your ‘catched’ image to be shown.