WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I use front end posting on my site so I don't get a chance to set a featured image for alot of my posts. So I use catch_the_image to get thumbs but it gets the original size and then scales it which is hurting page speed. Basically what I want to do is add "-150x150" into the string in the function so it pulls the smallest size of the 3 it stores in the uploads folder. So instead of picture.png it returns picture-150x150.png. Any idea how to add that to this function?

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

 return $first_img;
share|improve this question
Actually you can set the featured image on front end posting, using set_post_thumbnail codex – ifdion Mar 5 '12 at 7:18
How do I use that in my situation? People post from front end and can add an image and then I use the first image they post as the thumb. – Pollux Khafra Mar 5 '12 at 8:13
up vote 1 down vote accepted

You can add your own named image size by adding code to your functions.php.

Something in the line of add_theme_support('post-thumbnails');//might not be necessary add_image_size('front-end-150', 300, 300);

Now you should be able to use in your catch_that_image()

wp_get_attachment_image($post->ID, 'front-end-150')

for all newly uploaded images.

Your past images don't have the front-end-150, so you might want to use the regenerate thumbnail plugin (http://wordpress.org/extend/plugins/regenerate-thumbnails/)

Good luck!

share|improve this answer

An alternative is to put the upload form <input type="file"> in the front end posting form & process it along / after the rest of the function.

Here is the file input:

<input type="file" id="profile-picture" name="profile-picture[]" size="40" multiple />

Just change the name attribute accordingly. The [] on the attribute value & the multiple is for multiple file upload.

The attaching function :

function attach_uploads($uploads,$post_id = 0){
$files = rearrange($uploads);
    return false;   
foreach($files as $file){
    $upload_file = wp_handle_upload( $file, array('test_form' => false) );
    $attachment = array(
    'post_mime_type' => $upload_file['type'],
    'post_title' => preg_replace('/\.[^.]+$/', '', basename($upload_file['file'])),
    'post_content' => '',
    'post_status' => 'inherit'
    $attach_id = wp_insert_attachment( $attachment, $upload_file['file'], $post_id );
    $attach_array[] = $attach_id;
    require_once(ABSPATH . 'wp-admin/includes/image.php');
    $attach_data = wp_generate_attachment_metadata( $attach_id, $upload_file['file'] );
    wp_update_attachment_metadata( $attach_id, $attach_data );
return $attach_array;

You can find more on the rearrange function here.

And the additional function to attach as post_thumbnail

// put this along the other $_POST
$files = $_FILES['profile-picture'];

// insert attachment, after you have created the new post id → $post_id
$attached_files = attach_uploads($files,$post_id);

// set the first file as post thumbnail
    set_post_thumbnail( $post_id, $attached_files[0] ); 

Hope this help

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.