WordPress.org

Ready to get started?Download WordPress

Forums

Jetpack by WordPress.com
[resolved] Photon is incorrectly resizing full-size images in pages (20 posts)

  1. Dylan McCall
    Member
    Posted 1 year ago #

    When I enable Photon, all of the full-size images in one of my pages end up like this:

    <img class="size-full wp-image-1088" title="North Light Images" src="http://i0.wp.com/www.dylanmccall.com/wp-content/uploads/northlightimages.jpg?resize=640%2C399" alt="">

    As you can see, the image is incorrectly resized and the img tag is missing its width and height attributes (which can result in jarring layout changes when the page loads).

    When I disable Photon, these images are served correctly at their native size, and with the width and height attributes filled:

    <img class="size-full wp-image-1088" title="North Light Images" src="http://www.dylanmccall.com/wp-content/uploads/northlightimages.jpg" alt="" width="706" height="440">

    In posts, full-size images _also_ have a resize parameter in the URL, but in their case the size is correct so the image doesn't get squished.

    Has anyone else encountered this? Any idea what's going wrong?

    http://wordpress.org/extend/plugins/jetpack/

  2. designsimply
    Member
    Plugin Contributor

    Posted 1 year ago #

    We've already made some updates to fix that problem for Jetpack 2.0.1, which should be out this week.

    If you're comfortable patching the code on your own, you can try applying this changeset to your Jetpack 2.0 plugin:
    http://plugins.trac.wordpress.org/changeset/622713

    Or you can wait and update to 2.0.1 once it has been released.

  3. tophf
    Member
    Posted 1 year ago #

    I've applied the changeset (photon.php) but the header image is still resized incorrectly: http://i0.wp.com/...../files/Header_OnHover.jpg?resize=940%2C198 (correct dimensions are 980x400).
    Of course, I've cleared browser cache and tried direct download with wget CLI utility.

  4. Alexander S. Kunz
    Member
    Posted 1 year ago #

    Same here, but the problem began to show up only AFTER I updated to Jetpack v2.0.1!

  5. Dylan McCall
    Member
    Posted 1 year ago #

    Darn, I'm still seeing this with 2.0.2, exactly as described earlier. Is there something else I should do, or should the fix work right away?

  6. designsimply
    Member
    Plugin Contributor

    Posted 1 year ago #

    There are still a few scenarios that aren't covered, but we're continuing to work on them! Custom cropped images is one area that still needs some work, and it sounds like that might be the issue you're running in to. We should be able to get to it in the next major Photon revision we do.

  7. djape sudoku
    Member
    Posted 1 year ago #

    Moved my question to a new thread.

  8. billnanson
    Member
    Posted 1 year ago #

    I also have an issue here - my full size images have a 685px width. When served by photon they are all resized to 620px - I haven't rummaged around the whole site, but I haven't noticed it on smaller images.

    I switched off Photon and they were all 685 again...(?) Think I'll stay switched off until we have something a bit more consistent.

  9. designsimply
    Member
    Plugin Contributor

    Posted 1 year ago #

    @billnanson, can you link to a live example?

  10. designsimply
    Member
    Plugin Contributor

    Posted 1 year ago #

    Let me also follow-up to clarify some things which I probably should have explained in more detail before.

    First, note that the image width and height are removed intentionally. See this related note from the Jetpack Photon help page:

    Is there any way to keep the “width” and “height” tags in the replaced HTML?
    We remove the width and height arguments to prevent your images from skewing when the resized image doesn’t have the same dimensions as the original. This is particularly important when you switch from one theme to another, and the new theme is narrower than the previous theme. One of the benefits of Photon is that it will automatically resize your images so they don’t exceed the width supported by your theme. This means, though, that we don’t know what the new dimensions are.

    Source: http://jetpack.me/support/photon/

    In posts, full-size images _also_ have a resize parameter in the URL, but in their case the size is correct so the image doesn't get squished.

    The resize parameter is normal, Photon will always have that. It uses those instead of width and heigh attributes to make it more flexible.

    Regarding images getting squished or looking skewed, what Photon does is try to figure out what dimensions are best based on a few factors. It looks at the image width and height attributes, but it also looks at the containing element's size or the $content_width set by the theme. Would it be possible for you to link us directly to the post or page where we can see the image you originally posted about? Also, can you check to see if your theme sets a $content_width in its functions.php file?

  11. billnanson
    Member
    Posted 1 year ago #

    Well, of-course it's switched off now, but the 'header' image on this page is already sized to 685px width (basically max for the page) but with photon enabled changes to 620px - I have many similar with photon enabled.
    Good luck!!!

    http://www.burgundy-report.com/summer-2012/nuits-saint-georges-village-profile/

  12. designsimply
    Member
    Plugin Contributor

    Posted 1 year ago #

    @billnanson, I looked at http://www.burgundy-report.com/summer-2012/nuits-saint-georges-village-profile/ and I see that the post content area is set to 700px in the CSS, and that seems wide enough to me.

    For reference, here is the HTML for the first image in the post:

    <img src="http://www.burgundy-report.com/wp/wp-content/uploads/2012/11/nuits01.jpg" alt="" title="Turn of the (20th) Century Nuits St.Georges" width="685" height="385" class="alignnone size-full wp-image-28616">

    Would you mind switching Photon back on long enough to copy the new image source and paste it in a reply here? Also, what is your theme's $content_width set to in the functions.php file?

  13. billnanson
    Member
    Posted 1 year ago #

    I will leave it switched on for 24hrs so you can see (same URL - but it happens all-over...), but you will note the image is now resized to 620px from the 685px original:

    <img src="http://i2.wp.com/www.burgundy-report.com/wp/wp-content/uploads/2012/11/nuits01.jpg?resize=620%2C348" alt="" title="Turn of the (20th) Century Nuits St.Georges" class="alignnone size-full wp-image-28616" />

    I don't have a content width defined in my functions.php...
    Best

  14. Dylan McCall
    Member
    Posted 1 year ago #

    Aha! That explains it for me. I was using a custom theme and at some point I had set my content width to 640. Changed it to 920 and that solved my problem - assuming I never try to show images larger than 920px across. Just in case, is there a way we can get Photon to ignore the content width variable?

  15. etchedinpixels
    Member
    Posted 1 year ago #

    While I love Photon in some ways, I'm also having problems with it.

    I am using the Soliloquy Slider to display photos no my front page, here http://etchedinpixels.com/
    and Photon is messing with the image links. For some reason Photon is changing all the images to width=705. Like this:

    http://i2.wp.com/etchedinpixels.com/blog/wp-content/uploads/2012/11/Middle-Falls-68_70_HDR.jpg?w=705

    This doesn't match up with the settings in Soliloquy, which are being overridden. 705px also doesn't seem to correspond to the width of my page elements. There seems to be no choice but to disable Photon.

    Is there any way to disable Photon on a per-page basis? This would be really super. If anyone knows the Custom Field argument to do this I would be grateful.

  16. shelynx
    Member
    Posted 1 year ago #

    After updating today some images were shown cut off left/right or in wrong sizes (too small or in original size - too big for the post). I deactivated photon for now, but I'd love reactivate it if there was a solution to the problem.

  17. globe_trottah
    Member
    Posted 1 year ago #

    It says that this is resolved, though I appear to be getting Photon errors now:

    Warning: array_key_exists() [function.array-key-exists]: The first argument should be either a string or an integer in /hermes/waloraweb050/b1529/moo.wheresidewalksendcom/wp-content/plugins/jetpack/modules/photon.php on line 183

    :/

    It's giving a string of errors on my homepage showcase as well.

  18. askwpgirl
    Member
    Posted 1 year ago #

    I am having the same issue with Jetpack 2.0.4. I installed it, and all my images I had sized with width/height, shrunk. When I added in size-full as the class, that fixed it, but if I had made them image larger using width and height in the html, it ignored that.

  19. lindseybugbee
    Member
    Posted 1 year ago #

    I'm having the same issue... but only in Internet Explorer 8 and 9. My images there get width and height tag values of 1px, so they don't display at all.

    My custom theme uses the following code:

    function get_featured_image($post_id, $size, $class, $title)
    {
    if($class == NULL) { $class = 'wp-featured-image'; } else { $class = $class . ' wp-featured-image'; }
    if($post_id == NULL) { $post_id = get_post_thumbnail_id(); }
    $wp_featured_image = wp_get_attachment_image_src($post_id, $size, true);

    $src = $wp_featured_image[0];
    $width = $wp_featured_image[1];
    $height = $wp_featured_image[2];

    $output = '<img width="'.$width.'" height="'.$height.'" src="'.$src.'" class="'.$class.'" alt="'.$title.'" title="'.$title.'" />';

    return $output;
    }

  20. lindseybugbee
    Member
    Posted 1 year ago #

    I'm running Jetpack v2.2 by the way.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic