2

How can I change the size of a featured image thumbnail on the Edit Post screen for one of my custom post types?

Please note that I am looking to modify the size of the image displayed in the admin 'Edit Post' screen, and not on the front end of my site.

The size is determined by WP itself at the moment, and I don't seem to have any way of changing it.

0

From my past research I concluded that there is no sane way to affect the featured images box with actions and filters. My solution was to use jQuery inserted on the admin_head hook, to change things after they are loaded.

What I wanted was to add some textual detail outlining how the featured image would be used by the theme (something most themes should do just like sidebar descriptions, and for which there should be a filter). Here's code that shows what I did:

function gv_admin_featured_image_tweaks() {
    $output = "STUFF TO INSERT HERE";
    ?>
<script type="text/javascript">
    jQuery(document).ready(function($) {
        $('#postimagediv .inside').append("<?php echo $output; ?>");
    });
</script>
    <?php
}
add_action('admin_head', 'gv_admin_featured_image_tweaks');

Not elegant but effective. You could do something similar to change the image. Instead of using .append() to add content at the end of the metabox you could instead get $('#set-post-thumbnail') (the a tag with the image inside) and replace it with an img tag for the version of the featured image that you will use in your theme. Note that you can't just replace the SRC value of the existing IMG tag because it also has width and height.

1

Thanks to @SergeyBiryukov I've made some progress with the following taken from this trac ticket, however, it seems the best you can do is show a full size image, medium or thumb. I've not cracked custom size (e.g. 800px wide by 200px high for example) I will update my original post if I find a way!

// change size of admin featured image size in edit screen 
function change_featured_image_size_in_admin_28512( $downsize, $id, $size ) {
if ( ! is_admin() || ! get_current_screen() || 'edit' !==   get_current_screen()->parent_base ) {
return $downsize;
}

remove_filter( 'image_downsize', __FUNCTION__, 10, 3 );

// settings can be thumbnail, medium, large, full 
$image = image_downsize( $id, 'medium' ); 
add_filter( 'image_downsize', __FUNCTION__, 10, 3 );

return $image;
}
add_filter( 'image_downsize', 'change_featured_image_size_in_admin_28512', 10, 3 );
0

Featured images are called by using the_post_thumbnail() from within The Loop. You can specify a specific image size according to the image sizes available in Media Settings. E.g. the_post_thumbnail('medium'); would show the Medium size image. If you aren't happy with the images sizes available, you can change the sizes from the Admin area under Media Settings or add additional sizes from within functions.php. Be sure to either reload the image after the image sizes have been updated or use a plugin to rebuild all the images otherwise your picture will remain the same size regardless.

http://codex.wordpress.org/Function_Reference/the_post_thumbnail

  • I am referring to the size of the featured image as it appears on the 'Edit Post' screen, not on the frontend. – urok93 Mar 4 '13 at 4:07
0

If anyone is finding this years later...

Another option is to use something like Add Admin CSS to add custom styles to your backend. Once you do that it's as simple as using your browser dev tools to determine the right CSS to add. I used this to drag the Featured Image box above my Content Editor (allowed when using Advanced Custom Fields plugin) and overriding the default thumbnail size with CSS:

#postimagediv a#set-post-thumbnail {
    width: 100% !important;
    height: auto !important;
    height: 300px !important;
    overflow: hidden !important;}

#postimagediv img.attachment-266x266, #postimagediv img.size-266x266{
    width: 100% !important; 
    min-width: 100% !important;}

That should do the trick for this particular application.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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