How do I disable responsive images in WP 4.4?

Question

I succesfully converted my 4.3.1 install to all https. After updating to 4.4. I have a problem with the new srcset attribute. While the src attribute for images is set using https, the srcset attribute is http. This causes browsers to not display any image at all.

While waiting for a better fix, I wish to disable setting the srcset attribute altogether so that all images only have a src attribute. How do I do that?

Answer 1

Here are few things you could try to remove the responsive image support in 4.4:

/**
 * Disable responsive image support (test!)
 */

// Clean the up the image from wp_get_attachment_image()
add_filter( 'wp_get_attachment_image_attributes', function( $attr )
{
    if( isset( $attr['sizes'] ) )
        unset( $attr['sizes'] );

    if( isset( $attr['srcset'] ) )
        unset( $attr['srcset'] );

    return $attr;

 }, PHP_INT_MAX );

// Override the calculated image sizes
add_filter( 'wp_calculate_image_sizes', '__return_empty_array',  PHP_INT_MAX );

// Override the calculated image sources
add_filter( 'wp_calculate_image_srcset', '__return_empty_array', PHP_INT_MAX );

// Remove the reponsive stuff from the content
remove_filter( 'the_content', 'wp_make_content_images_responsive' );

but as mentioned by @cybmeta the problem may be elsewhere.

Force https on srcset

You could do some debugging with the wp_calculate_image_srcset filter and even try this quick-fix:

add_filter( 'wp_calculate_image_srcset', function( $sources )
{
    foreach( $sources as &$source )
    {
        if( isset( $source['url'] ) )
            $source['url'] = set_url_scheme( $source['url'], 'https' );
    }
    return $sources;

}, PHP_INT_MAX );

to set the url scheme to https. Another approach would be to have it schemeless //.

Check out the Codex for other set_url_scheme() options:

$source['url'] = set_url_scheme( $source['url'], null );        
$source['url'] = set_url_scheme( $source['url'], 'relative' );

But you should try to dig deeper and find the root cause.

Update:

We could bail out earlier from the wp_calculate_image_srcset() function with:

add_filter( 'wp_calculate_image_srcset_meta', '__return_empty_array' );

then using the wp_calculate_image_srcset or max_srcset_image_width filters.

Also updated according to ticket #41895, to return an empty array instead of false/null.

Answer 2

The simplest and cleanest way to do this is simply this:

add_filter( 'wp_calculate_image_srcset', '__return_false' );

To echo what most other folks are saying though, srcset is a good idea and is the future (best practice now), but if you need a quick fix to keep your site working, the above snippet does the job without any hacking.

source: WP Core Blog

Answer 3

Most likely, the reason the URLs in your srcset attributes are incorrectly showing HTTPS is because the URLs for all images are built using the value of the siteurl option in your wp_options table. If you're serving your front end over HTTPS, you should also change those values (via Settings > General).

Here's the related ticket on the WordPress issue tracking system: https://core.trac.wordpress.org/ticket/34945

Answer 4

This will disable the srcset code by eliminating any images wider than 1 pixel.

add_filter( 'max_srcset_image_width', create_function( '', 'return 1;' ) );

In the long run, you should try to fix the actual problem. Still, this works if you need a quick fix.

Answer 5

In Settings/General make sure your WordPress Address (URL) and Site Address (URL) are set to the https://yourdomain.com

See http://wptavern.com/how-to-fix-images-not-loading-in-wordpress-4-4-while-using-ssl

Joe McGill, who helped lead the effort to get responsive images into WordPress, also responded in the forum thread and confirms Cree’s suggestion is correct, “If you’re running HTTPS on the front end, you should change the URLS for your home and site URL in Settings > General so they use the HTTPS scheme,” he said.