Support » Developing with WordPress » Post thumbnail won’t scale proportionally

  • I’m trying to use featured image by using the_post_thumbnail. Whether I set the size by adding add_image_size in functions page or leave blank the image maintains a fixed height when sizing down. When I insert the image manually just pulling it from my cdn it sizes as expected. I can’t figure out why the height stays fixed causing the image to squish.

    Am I missing something simple? I did find this code in a forum that does fix the issue but not sure this is the best fix

     //  Temp fix to remove fixed width and height on post thumbnails
    function remove_image_size_attributes( $html ) {
        return preg_replace( '/(width|height)="\d*"/', '', $html );
    }
     
    // Remove image size attributes from post thumbnails
    add_filter( 'post_thumbnail_html', 'remove_image_size_attributes' );
     
    // Remove image size attributes from images added to a WordPress post
    add_filter( 'image_send_to_editor', 'remove_image_size_attributes' );
    // end temp fix

    Any suggestions welcome…thank you

Viewing 8 replies - 1 through 8 (of 8 total)
  • Moderator bcworkz

    (@bcworkz)

    The img tag attributes do not have much bearing on final appearance anymore. They are sort of a legacy attribute. Are the actual downsized images distorted? (by viewing the file directly, not as part of a page) Or is the appearance on the page the only distortion? Is the size you want to use an added size or is it one of the default sizes?

    tkmets5

    (@tkmets5)

    It’s the appearance on the page distorting it. It keeps the height when i shrink the page instead of adjusting proportionally. The image itself is fine…I’m trying to post a link to the site on flywheel but it keeps crashing. I will as soon as I can. I am just using default sizes but have also tried adding sizes as well.

    tkmets5

    (@tkmets5)

    I was able to get it how I want by targeting that image in css and setting the height to auto. I still feel like this is a hack and there is a better way, or I’m doing something wrong.

    Moderator bcworkz

    (@bcworkz)

    It sounds like the cause is related to your theme’s CSS, so adding overriding CSS to the Additional CSS panel would be one of the proper ways to correct the problem. The CSS could instead be overridden from style.css of a child theme. Avoid directly editing your theme’s .css files unless the theme has provided a file specifically for this purpose.

    This is actually a custom theme I’m building from an HTML/JS/CSS site I previously built. So I am in full control of the CSS and the theme. So I’m pretty certain the CSS is ok as the html version is live and fine. I use a very stripped down version of underscores.

    Moderator bcworkz

    (@bcworkz)

    Ah, OK, that’s fine. Underscores files are all specifically for direct editing 🙂

    I would love for a second look at that page with the image in question….would you mind taking a look if I put up a link to the dev server? Thanks

    Moderator bcworkz

    (@bcworkz)

    As long as it’s openly accessible, sure go ahead. Password protections are viewed with suspicion because we don’t permit admin access by other members. Even if the password does not grant any privileges, it’s not a good look. What sort of feedback are you looking for?

Viewing 8 replies - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.