Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I want make all my blog thumbs the size of 227x133. I need images width have 100% (for responsive design). Some images have width greater than the other and vice versa.

I'm using this code to show the thumbs of my blog:

/ / Post thumbnails sizes
add_theme_support ('post-thumbnails');
add_image_size ('blog-page', 9999, 545, true);

The problem is that the images are not the same size as each other:

How is: http://img834.imageshack.us/img834/1856/77751386.png

How I want: http://img17.imageshack.us/img17/5461/68767097.png

What's wrong?

share|improve this question
add comment

3 Answers

up vote 2 down vote accepted

Intermediate image sizes are discrete, not variable. When you define an image size, with specific dimensions (whether hard-cropped or box-resized), WordPress will create a discrete image, with the specified dimensions.

Otherwise, if width could be defined dynamically, WordPress would have to create a prohibitively large number of images, just to account for responsiveness.

To account for responsive design, you'll have to use CSS. The easiest way to do so is using a rule similar to the following:

#content img {
    max-width: 100%;
    height: auto;
}

That way, if the #content div is resized, your post images will be resized along with it, while maintaining their aspect ratio.

share|improve this answer
    
Chip, i already have this css(div class="span4") from bootstrap, on each. But i need to put an add_image_size because of height of the images. :/ –  Chead Feb 16 '13 at 23:32
    
I'm sorry; I don't understand what you're saying here? –  Chip Bennett Feb 17 '13 at 0:03
add comment

I see you are fairly new here . I hope we can assist you and if you find an answer helpful, please upvote and check it as accepted so others with your problem will see the solution.

If you are trying to resize thumbnails,

Try replacing what you had with this in your functions.php file

if ( function_exists( 'add_theme_support' ) ) { 
    add_theme_support( 'post-thumbnails' );
    set_post_thumbnail_size( 227, 133, true ); // default Post Thumbnail dimensions (cropped)
}
share|improve this answer
    
Where do i put that is "blog-page" thumbnails? –  Chead Feb 16 '13 at 23:30
    
Are you trying to resize blog post thumbnails (featured images) OR images you add to the content of a blog post? –  Aliyah Feb 16 '13 at 23:38
    
Is featured images from a custom post type page called(blog-page). –  Chead Feb 16 '13 at 23:42
    
replace your old code from your original post with mine. try that or try another answer to see what works for you –  Aliyah Feb 16 '13 at 23:43
add comment

The assigned image sizes are only generated upon upload. If you have uploaded the files before you set the thumbnail size and crop setting you need to regenerate them. This can be accomplished with this plugin: http://wordpress.org/extend/plugins/regenerate-thumbnails/

Also if you want the thumbnail to crop you should have the correct aspect ratio sate for the image size.

add_image_size ('blog-page', 227, 133, true); //1.7:1 aspect ratio
add_image_size ('blog-page', 926, 545, true); //1.7:1 aspect ratio
share|improve this answer
add comment

Your Answer

 
discard

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.