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?

  • 2
    I would also like to know this - its just made a right mess of our website! – Chris Dec 10 '15 at 10:24
  • I have tried various ways with no success but I wanted to leave the main question open to new approaches. The most drastic of my attempts was commenting out the add_filter line in default-filters.php I believed to be responsible: //add_filter( 'the_content', 'wp_make_content_images_responsive' ); – brokkr Dec 10 '15 at 10:27
  • 1
    Instead of disable responsive images, you should look for what is mixing HTTP and HTTPS because the responsive images functionality is not the origin of the problem. All my websites are under HTTPS and the srcset is correctly created by WordPress. How did you migrated from HTTP to HTTPS? – cybmeta Dec 10 '15 at 10:29
  • Seems pretty wel cleared up now. Apologies for double posting - the root issue (srcset should use https) is also resolved in the thread I started over at wordpress.org (wordpress.org/support/topic/…) In my defense the thread seemed pretty dead after a day or so when it was revived. Thanks to joemcgill who resolved it over there. – brokkr Dec 12 '15 at 15:51
up vote 43 down vote accepted

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.

  • Just to confirm that both the approaches worked as each was intended for me, the disable srcset removed srcset (and so brought back 'fixed' images) and the force https changed srcset urls to https. Both approaches removed the mixed content warning. – brokkr Dec 12 '15 at 15:47
  • 4
    The add_filter( 'wp_calculate_image_srcset_meta', '__return_null' ); solution worked great for me. Thank you! – Tim Bowen Jan 10 '16 at 18:28
  • I spent hours on this -- thanks! – Nate Mar 8 '17 at 4:15
  • Glad to hear it helped. – birgire Mar 8 '17 at 8:27
  • This will cause warnings on a validator: "The sizes attribute may be specified only if the srcset attribute is also present." – Michael Rogers Nov 1 '17 at 19:17

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

  • 5
    Just use __return_false instead of disable_srcset, wp has functions for simple tasks like that. – Jake Mar 17 '16 at 13:56
  • 3
    And you both could improve your code by not making a whole new function just to return false. WordPress provides functions to do that. codex.wordpress.org/Function_Reference/_return_false – Jake Mar 18 '16 at 22:49
  • 1
    This is the right solution. This feature is about as well thought out as wp_autop. I use <picture> to get art direction as well as responsive images, and this doesn't address that. – Peter Wooster May 10 '16 at 11:40
  • 1
    @Jake on a scale of 1 to 10, "creating a new function just to return false" adds about -2 bloat to WordPress. Self-documenting code that anyone (not just a WP dev) can understand is of a certain value. – Mahmoud Al-Qudsi Jul 15 '17 at 22:37
  • 1
    @MahmoudAl-Qudsi Because '__return_false' is so confusing? This discussion, on a WordPress forum, is about turning off a WordPress feature. It isn't crazy to just use the default, very basic and well documented, WordPress return functions built-in to WordPress to do that. The fact that the function is named "return_false" is pretty self-documenting. Try and guess what it does? – Jake Jul 16 '17 at 21:11

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

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.

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.

Your Answer

 
discard

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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