16

How can I remove the width and height attributes from the post_thumbnail when inserting with <?php the_post_thumbnail(); ?>?

<img width="800" height="533" src="http://domain.com/wp-content/uploads/2011/02/image.jpg" class="attachment-post-thumbnail wp-post-image" />
6
  • look for thumbnail.php file, not sure but usually that files contain the hard coding Commented Jul 7, 2011 at 14:54
  • In case you were wondering, I want to be able to modify widths and height with CSS - more specifically set a max-width and let the height set itself rather than default to the hard coded one.
    – Carson
    Commented Jul 7, 2011 at 14:54
  • use firebug to get the exact class or ID, or give me your URL Commented Jul 7, 2011 at 14:56
  • 2
    Changing anything in a file outside the theme (for example post-thumbnail-template.php) would be a bad idea as any WordPress update would overwrite it.
    – Carson
    Commented Jul 7, 2011 at 15:10
  • What makes you think you need to remove the attributes to do what you want?
    – t31os
    Commented Jul 7, 2011 at 17:27

4 Answers 4

25

Related: Filter to remove image dimension attributes?

There's a filter on post_thumbnail_html which receives as its argument the full html element representing the post thumbnail image before it's echoed to the page. You can filter out the dimensions with a bit of regex:

add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10, 3 );

function remove_thumbnail_dimensions( $html, $post_id, $post_image_id ) {
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}
2
  • It does not work for me. add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10, 3 ); function remove_thumbnail_dimensions( $html, $post_id, $post_image_id ) { if ( wp_is_mobile() ) { $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html ); } return $html; } Commented Sep 11, 2014 at 10:20
  • This will remove width/height from all instances of where the_post_thumbnail() is used. Commented Jan 24, 2020 at 0:03
6

you could just grab the url of the thumb and put it in an img tag yourself:

<?php
$thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'your_thumb_handle' );
?>
<img src="<?php echo $thumbnail['0']; ?>" />
2
  • 1
    That's the only solution I've come across too, was just hoping there was a way to do it without a workaround.
    – Carson
    Commented Jul 7, 2011 at 15:09
  • 1
    But you also need to query for the alt and title attributes
    – MZAweb
    Commented Apr 6, 2012 at 17:41
0
add_filter( 'post_thumbnail_html', 'remove_thumbnail_dimensions', 10 );
add_filter( 'image_send_to_editor', 'remove_thumbnail_dimensions', 10 );
add_filter( 'the_content', 'remove_thumbnail_dimensions', 10 );
function remove_thumbnail_dimensions( $html ) {
    $html = preg_replace( '/(width|height)=\"\d*\"\s/', "", $html );
    return $html;
}

this will do the job, "the_contnet" will remove all post content text image width and height.

2
  • Please edit your answer, and add an explanation: why could that solve the problem?
    – fuxia
    Commented Aug 23, 2018 at 14:53
  • For me, this also strips the containing 'figure' tag, and removes the caption. :/
    – MastaBaba
    Commented Feb 8, 2022 at 11:18
0

I prefer this solution below as I'm not doing a global replace with a function. This would be incorporated into your theme files.

<?php echo preg_replace( '/(width|height)="\d*"/', '', get_the_post_thumbnail( get_the_ID(), 'large' ) ); ?>

You can replace "large" with "thumbnail", "medium", "full", or your custom image size declared in your theme.

Your Answer

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

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