Andreas Steffan
Andreas Steffan

Reputation: 6159

How do I force the WordPress post thumbnail to display at a fixed size?

I want the post thumbnail image to display at a fixed size (large), no matter what. If the full size image is bigger, use the large one (and do not downscale the full one). If the full size image is smaller, use the full size, set width/height attributes of the img element and let the browser do the up-scaling. Been playing with get_the_post_thumbnail and conditionals for a while, but fail to get width/height attributes right without getting messy.

Anyone willing to share a clean solution?

Upvotes: 2

Views: 6920

Answers (3)

Andreas Steffan
Andreas Steffan

Reputation: 6159

This is what I came up with. It is horrible, but I found no other half decent way to get around the $hwstring issue in wp_get_attachment_image.

$image_data = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full' );
$lw = get_option( "large_size_w");
// Scale up if full version size is smaller than large
if ($image_data[1] < intval($lw)) {
    $ratio = $lw / $image_data[1];
    $h = round($ratio * $image_data[2]);
    $thumb = get_the_post_thumbnail( null, 'full', array(title => get_the_title()));
    $thumb = preg_replace('#\s(width)="[^"]+"#', ' width="'.$lw.'"', $thumb);
    echo preg_replace('#\s(height)="[^"]+"#', ' height="'.$h.'"', $thumb);
} else {
    the_post_thumbnail('large', array(title => get_the_title() ) );
}

Upvotes: 0

Firefog
Firefog

Reputation: 3174

Re-check your theme support add_theme_support('post-thumbnails');

Default WordPress Thumbnail

the_post_thumbnail( 'thumbnail' );     // Thumbnail (150 x 150 hard cropped)
the_post_thumbnail( 'medium' );        // Medium resolution (300 x 300 max height 300px)
the_post_thumbnail( 'medium_large' );  // Medium Large (added in WP 4.4) resolution (768 x 0 infinite height)
the_post_thumbnail( 'large' );         // Large resolution (1024 x 1024 max height 1024px)
the_post_thumbnail( 'full' );          // Full resolution (original size uploaded)

If You need a specific resolutions

the_post_thumbnail( array(500, 500) );  // 500x500 dimension 

Post Thumbnail Linking to Large Image Size you can change the size by changing large

if ( has_post_thumbnail() ) {
    $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large' );
    if ( ! empty( $large_image_url[0] ) ) {
        printf( '<a href="%1$s" alt="%2$s">%3$s</a>',
            esc_url( $large_image_url[0] ),
            esc_attr( get_the_title_attribute( 'echo=0' ) ),
            get_the_post_thumbnail()
        );
    }
}

You can also create custom featured image sizes in your theme’s functions

 add_image_size( 'custom-thumb', 300, 300); //Simple widget size
 add_image_size( 'sidebar-thumb', 120, 120, true ); // Hard Crop Mode
 add_image_size( 'homepage-thumb', 220, 180 ); // Soft Crop Mode
 add_image_size( 'singlepost-thumb', 590, 9999 ); // Unlimited Height Mode

Here is an example of how to create custom Featured Image sizes in your theme’s functions.php file.

if ( function_exists( 'add_theme_support' ) ) {
    add_theme_support( 'post-thumbnails' );
    add_image_size( 'custom-thumb', 300, 300); // 300 pixels wide 
 }

Displaying additional image sizes in your WordPress theme

the_post_thumbnail( 'your-specified-image-size' ); //Example singlepost-thumb

Upvotes: 5

marcin.g
marcin.g

Reputation: 365

I will try this solution:

1) add to functions.php this: add_theme_support( 'post-thumbnails' );

2) then in wordpress loop add this: <?php echo get_the_post_thumbnail(get_the_ID(), 'full'); ?>

Upvotes: 0

Related Questions