1

I've built a few sites in Wordpress and in general I'm quite pleased with all the possibilities it has developed lately. There's one main thing that is utterly confusing for end users; the sizes they have to choose when using an image. They really do not understand the concept of pixels, and then they also forget to pick a size anyway. It's very demanding.

Coming from CMS systems such as Expression Engine, I am used to the end user uploading the file and the sizes are generated using ImageMagick (or similar) through the template/theme. So he'll never have to choose a size. This also has the advantage that images are constantly the same in sliders etc.

So is there a way of simplifying this procedure? No size options, resizing only when needed on a page and in the exact size.

Improve this question
4
  • Are the images you want your users to upload being used in posts and pages? or automatically used in the template? And based on your title you say 'eliminate sizes during upload', but then you say you want WordPress to automatically create sizes like Expression Engine does - please clarify
    – Stephen S.
    Jan 30, 2014 at 18:40
  • Hi Stephen, the idea is that images will be resized to fit the design of the site, but if you insert an image in WP you have to pick a size. I would rather not show this to the user but let the system pick the right size that belongs to the template being used. Hope that clears things up a bit?
    – noregt
    Jan 30, 2014 at 22:43
  • Plugin recommendation: Dynamic Image Resizer, available on GitHub. How to use it shows shortcode and template tag variant.
    – kaiser
    Mar 17, 2014 at 11:37
  • Looks good, especially since it uses the Code from WP instead of Timthumb :-)
    – noregt
    Mar 17, 2014 at 15:10

1 Answer 1

Reset to default
3

Users shouldn't have to know anything about image sizes. Just have them upload as-large-as-needed images and your job is to get WordPress to do the rest.

When a user uploads an image, WordPress will generate as many images as you've declared with add_image_size().

An example from the codex for your functions.php file:

if ( function_exists( 'add_image_size' ) ) { 
    add_image_size( 'category-thumb', 300, 9999 ); //300 pixels wide (and unlimited height)
    add_image_size( 'homepage-thumb', 220, 180, true ); //(cropped)
}

On the templating side, there a few different ways to get those image sizes out. the_post_thumbnail() is probably the most common.

the_post_thumbnail('category-thumb');
// or
the_post_thumbnail('homepage-thumb');

would get both image sizes we set up a second ago.

You'll notice after reading the codex that some sizes are cropped. If you upload 1000x500 image and ask add_image_size to create a square image, something has to go. Wordpress will do this from the center by default but you can also allow users to create these themselves for better art direction. http://wordpress.org/plugins/post-thumbnail-editor/ is an example plugin, there are a few more. http://codecanyon.net/item/theia-smart-thumbnails/3160252 also looks really interesting. Instead of setting the crops for each, the user clicks on the 'interesting' part of the photo and the plugin (supposedly) generates all crops so that the focal point remains in the image.

Edit: Some other options for on-the-fly image resizing. Note, I haven't tried any of these: https://github.com/syamilmj/Aqua-Resizer
https://gist.github.com/seedprod/1367237
http://wordpress.org/plugins/image-resizer-on-the-fly/

Improve this answer
3
  • Thanks Will. Apparantly this is the way Wordpress works. My point is that those sizes return when you insert an image. If you use it for a small gallery you have to pick the small image that was rendered during upload. If you pick for instance the original size it will be resized through html/css. I've seen some WP sites that render very slowly because they've used the original size as thumbnails. Wordpress renders predefined sizes whether you use them or not. I'd rather have a system that scales images afterwards as they are used in pages. Timthumb does something like that?
    – noregt
    Jan 30, 2014 at 22:54
  • @noregt I added a few real time options to my answer.
    – Will
    Jan 31, 2014 at 18:45
  • Thanks Will for the great links, I'll dive into them to see what works best :-)
    – noregt
    Feb 1, 2014 at 16:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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