Not all sizes appearing in “srcset”

Replies: 0

In my theme, I register the following image sizes:

add_image_size( '256-horizontal', 256, 0 );
add_image_size( '960-horizontal', 960, 0 );
add_image_size( '1366-horizontal', 1366, 0 );
add_image_size( '1920-horizontal', 1920, 0 );
add_image_size( '4096-horizontal', 4096, 0 ); // This one won't generate here because it's larger than the original, that's not the issue.

However, when displaying the image on a page – wither inside a post, or as an attachment, certain sizes are not even written out into the srcset:

http://localhost/wordpress/wp-content/uploads/test.jpg 2528w,
http://localhost/wordpress/wp-content/uploads/test-256x350.jpg 256w,
http://localhost/wordpress/wp-content/uploads/test-960x1312.jpg 960w,
http://localhost/wordpress/wp-content/uploads/test-1366x1867.jpg 1366w

As you can see, the 1920w size is not there. It has been generated – I’ve checked – but whatever loop is supposed to print it just doesn’t do it. (For this test I have disabled the default WordPress thumbnail sizes by setting the sizes of all 4 types to 0 x 0).

I have checked that all image sizes are generated – the files are there, and they are also accessible via browser:

    Directory: C:\xampp\htdocs\wordpress\wp-content\uploads

Mode                LastWriteTime     Length Name
----                -------------     ------ ----
d----        13/12/2019     10:03            temp
-a---        14/12/2019     17:19     562892 test-1366x1867.jpg
-a---        14/12/2019     17:19     975611 test-1920x2625.jpg
-a---        14/12/2019     17:19      25697 test-256x350.jpg
-a---        14/12/2019     17:19     308656 test-960x1312.jpg
-a---        14/12/2019     17:19    2510193 test.jpg

The sizes are also registerred in the MySQL database, for what it’s worth (formatted for readability):

a:5:{
  s:5:"width";i:2528;s:6:"height";i:3456;s:4:"file";s:8:"test.jpg";s:5:"sizes";
  a:4:{
    s:14:"256-horizontal";a:4:{s:4:"file";s:16:"test-256x350.jpg";s:5:"width";i:256;s:6:"height";i:350;s:9:"mime-type";s:10:"image/jpeg";}
    s:14:"960-horizontal";a:4:{s:4:"file";s:17:"test-960x1312.jpg";s:5:"width";i:960;s:6:"height";i:1312;s:9:"mime-type";s:10:"image/jpeg";}
    s:15:"1366-horizontal";a:4:{s:4:"file";s:18:"test-1366x1867.jpg";s:5:"width";i:1366;s:6:"height";i:1867;s:9:"mime-type";s:10:"image/jpeg";}
    s:15:"1920-horizontal";a:4:{s:4:"file";s:18:"test-1920x2625.jpg";s:5:"width";i:1920;s:6:"height";i:2625;s:9:"mime-type";s:10:"image/jpeg";}
  }
  s:10:"image_meta";a:12:{...other metadata...}
}

I have experimented with a bunch of sizes, and I’m not sure if it has to do with image size (shouldn’t, I’ve seen it print larger images before, but in my current case it doesn’t seem to go above 1650 in some cases, or above 1600 in others*), or maybe the amount of sizes (I tried adding only the 1920 size, but it still didn’t print into the srcset). Finally, I tried this with a bunch of different themes just in case, to no avail either.

*The only response I got was with changing sizes, but even that seemed inconclusive. In one test, it seemed to stop adding sizes to the list above 1650 (when I created sizes 1600, 1610, 1620 … 1650), but after coming back and trying it again, the largest size it prints is 1600w.

I’m quite stumped. Any ideas?

• This topic was modified 28 seconds ago by redquaice. Reason: typos and readability