Custom Image Thumbnails of Different Sizes

I have a Custom Post Type which contains custom fields for uploading images of different types for a portfolio site.

For example: (logos, websites, print-ads, etc…).

Read More

I plan on uploading images of all different sizes and aspect ratios, but I need to have a smaller size (thumbnail) of a specific (and different) size for each image type. I also need functionality to crop these thumbnails manually.

Logo thumbs -> 200×200

Website thumbs -> 450×200

print-ad thumbs -> 200X400

etc…

I’ve been toying with a couple plugins: Post Thumbnail Editor and Multiple Post Thumbnails. These seem to be too buggy in WordPress 3.3 and they don’t appear to do exactly what I want though.

I could of course just upload 2 different versions of each image and use the crop tool in the backend to get them to the right size but I would love a more elegant approach.

I guessewhat I am really looking for is some advice.

  • Should I keep fighting with existing plugins and try to get something
    working?
  • Should I try to develop my own? (I’m pretty decent with
    php/javascript but have only written extremely simple wp plugins as
    of yet)?
  • Should I give up and use the dirty (upload 2 versions of
    each) approach?

What’s the best option to handle this type of situation?

Related posts

Leave a Reply

1 comment

  1. Add this code to your functions.php

    if(function_exists('add_theme_support'))
    add_theme_support('post-thumbnails');
    
    // Set the thumbnail size
    add_image_size('custom_logo', 200, 200, true );
    add_image_size('custom_website_thumb', 450, 200, true );
    add_image_size('custom_print_ad_thumb', 200, 400, true );
    

    Put this in your post template where you want to see the image.

    <?php echo get_the_post_thumbnail($post_id, 'custom_logo'); ?>
    

    You can also wrap it in a link like this.

     <a href="<?php echo get_permalink($post_id) ?>" title="<?php echo get_the_title($post_id); ?>"> <?php echo get_the_post_thumbnail($post_id, 'custom_logo'); ?></a> 
    

    You can see the WordPress Codex for more exploitation.

    Remember to set the images as a featured image on upload to be able to use it.

    Codex Link