Jasper de Groot

Hi Nicholas,

This thread now contains a lot of information about issues with various browsers on various devices. That makes it a bit hard to understand what is happening where and to determine if that’s a browser/Picturefill bug or not.
Do you have a test site online, or only local?

Hi Ben,

Can you tell us more about your custom image sizes?

Do your custom image sizes ‘mobile’ and ‘tablet’ have the same aspect ratio or did you add other custom image sizes with the same aspect ratio for both ‘mobile’ and ‘tablet’?
If there are no other image sizes available with the same aspect ratio wp_get_attachment_image_srcset() will return false, because a srcset with one source is the same as src and has no use.

If you have one image size for mobile and one for tablet and they have different aspect ratios then you would indeed need to use a <picture> element. But this is outside the scope of this plugin and what will be included in WP core 4.4.

Earlier you said that $img_srcset = wp_get_attachment_image_srcset( 380, 'medium' ); is returning false too. This should normally result in a srcset value because ‘medium’ and ‘large’ have the same aspect ratio. Is the original image with ID 380 big enough to create a ‘large’ image?
Do you use the defaults for these image sizes (medium: 300, large: 1024) or did you change them in the media settings?

Hi Sheelah,

Thanks for confirming. Then it should be fixed in the upcoming release.

Hi Agitana,

The problems with the W3 Total Cache plugin have been reported before. See this topic. There is nothing we can do to fix it, but I did open a topic in W3TC support to make the author aware of it.

This issue only seem to occur when there is no size defined for the post thumbnail with set_post_thumbnail_size(). The problem has been resolved by some changes we made after 3.0.0. We will release a new version within a few days.

Sheelah, Can you confirm that your theme doesn’t set a post thumbnail size? I.e. the featured image is the full size image.

Agitana, Your problem seem to be a different case because you specify image size “large” when you call the_post_thumbnail(). Maybe you can provide a bit more information about your case. What is the original size of the image and what dimensions do you use for image sizes “thumbnail” (crop or no crop), “medium”, and “large”? Are any additional image sizes added with add_image_size()?

Thanks!

I am glad you now get the expected responsive image markup. Personally I would use the SD image (1024×1024) as original source, because that’s the fallback if for some reason responsive images don’t work. You can use the image_size_names_choose filter to add image sizes to the select menu in the media library.

Regarding the problems you mention. It’s a bit hard to tell if it’s actually a browser/Picturefill issue without knowing more about the devices that you test on (screen resolution, SD or HD/Retina, etc.).

I made a mistake, sorry. When we filter the content and call wp_get_attachment_image_sizes() we don’t pass the size name but a size array to the function and its filter. That has to do with performance.
So it should have been:

add_filter( 'wp_get_attachment_image_sizes', 'benoit_custom_sizes', 10, 5);
function benoit_custom_sizes( $sizes, $size, $image_meta, $attachment_id, $image_src ) {
    if ( $size[0] === 1024 ) {
        $sizes = '(min-width: 768px) 62.2vw, 93.75vw';
    }
    return $sizes;
}

I hope that works.

I have no idea yet why the 2048×2048 isn’t included in the srcset. The code for the max_srcset_image_width looks good.

Re:

add_filter( 'wp_get_attachment_image_sizes', 'benoit_custom_sizes', 10, 3);
function benoit_custom_sizes( $args, $id, $size ) {
    if ( $size == 'full' ) {
        $args['sizes'] = '(min-width: 768px) 62.2vw, 93.75vw';
    }
    return $args;
}

That’s using the new filter wp_get_attachment_image_sizes but the callback benoit_custom_sizes() is based on the old filter tevkori_image_sizes_args. That won’t work. wp_get_attachment_image_sizes expects a string, not an array. The variables that are passed to the filter are different too. The backward compatibility issue that we have to fix will only apply when the deprecated tevkori_image_sizes_args filter is used.

This should work:

add_filter( 'wp_get_attachment_image_sizes', 'benoit_custom_sizes', 10, 5);
function benoit_custom_sizes( $sizes, $size, $image_meta, $attachment_id, $image_src ) {
    if ( $size == 'full' ) {
        $sizes = '(min-width: 768px) 62.2vw, 93.75vw';
    }
    return $sizes;
}

You don’t need all the variables that are passed to the filter but I kept them in there for completeness. See also the inline documentation of the new filter.

This applies to version 3.0.0 of the plugin. As Joe already mentioned we are going to rename the filter and the order of the parameters because it also has been changed in WP core.

I think this is related to your other post: https://www.ads-software.com/support/topic/larger-image-being-served-than-should-be?replies=12#post-7634914. See my comment there.

Sorry, I meant the $attr param of the_post_thumbnail()or the wp_get_attachment_image_attributes filter. Typos ??

Update: I said the post_thumbnail_html filter but it’s easier to use the wp_get_attachment_image_attributes filter.

Hi donaldG2,

Thanks for the heads-up!
When the plugin creates the srcset it only includes images with the same aspect ratio as the original image. If there are no other sizes with the same ratio available it doesn’t add a srcset.
At least, that is what is supposed to happen. I don’t know what went wrong in your case at what version of the plugin you were using at that time. We just released version 3.0.0 of the plugin which uses the same code as we added to core. It would be great if you could test by temporary removing the crops you added and using the same small image as before.
Thanks!

Hello Nick,

That filter was supposed to work with both content images and featured images so to be honest I don’t why it didn’t work in your case. However, we just released version 3.0.0 of the plugin in which a lot has changed. You can now use the wp_get_attachment_image_sizes filter (this is a plugin filter, but will be included in WordPress as from version 4.4) to adjust the sizes value. This will apply to content images and featured images. If you only want to adjust sizes for featured images or want to use a different value for those, you can use the wp_get_attachment_image_attributes filter (this is a WordPress core filter).

I hope this helps!

Hi rsmith4321

Sorry for the late reply. Yes this is possible.
The following information is based on the 3.0.0 version of the plugin that we just released and it will also work in WordPress 4.4 where responsive images will be integrated.
You can use the wp_calculate_image_srcset filter to remove an image from the array that is used to create the srcset.

add_filter( 'wp_calculate_image_srcset', 'my_callback_function' );

function my_callback_function( $sources ) {
    unset( $sources[100] );
    return $sources;
}

I hope this helps!

Hi ryanlegal32

I do not really understand the if () { } part of your code, but I can answer this question:

Shouldn’t this plugin by nature bump this up to the 700px width version of the jpeg

No, because the images have different aspect ratio.
This plugin adds a srcset attribute to offer a set of sources for the same image. A srcset should only contain source images of which height divided by width has the same result as that of the original source image. If your large image would be 700 x 11469 it would be included. That’s a very heavy image though. Not sure you should want that to load on a mobile device.
Because non of your images have the same aspect ratio, none of them will be included in the srcset and a srcset with just one image (the original source image) won’t be added because that’s the same as src.

There is also a picture element to make images responsive. With this you can use images of different aspect ratio, but this is outside the scope of this plugin. For more information see https://responsiveimages.org/

I hope this helps.

Hi Toru,

Sorry for the late reply.
We just released version 3.0.0 of the plugin. In there tevkori_image_sizes_args() has been deprecated and replaced by wp_get_attachment_image_sizes(). Responsive images will be included in WordPress itself as from version 4.4 so the plugin has been prepared for that change.
The new function doesn’t accept a $args param anymore. The best thing you can do is to use its filter wp_get_attachment_image_sizes to adjust the value for the sizes attribute of images in the content (instead of an array you will have to pass a string). For featured images you can either use the $args param of the_post_thumbnail() or the filter or the wp_get_attachment_image_attributes filter to set the sizes attribute.
This should work with WP 4.3 and older with the plugin and in WP 4.4 with or without the plugin.

Hope this helps.