Retina Display isn't working in C5.8.3
Permalink
As in the new Concrete5.8.3 says in the release notes and improvements, it says Retina Display thumbnails is supported. There is also a new option under System > Thumbnails > Options that enables creating Retina/High DPI Thumbnail.
So I created a test page with a 640px image, I put one in an image block and another in a content block, I downloaded the images on both a Retina-supported device (iPhone6+) and a non-retina supported device. The images were download in 320px width in both devices.
Shouldn't Retina support create high pixel display thumbnails on Retina devices like iPhone6+? and wasn't the image supposed to be downloaded in 640px instead of 320px (double the amount of pixels)?
So I created a test page with a 640px image, I put one in an image block and another in a content block, I downloaded the images on both a Retina-supported device (iPhone6+) and a non-retina supported device. The images were download in 320px width in both devices.
Shouldn't Retina support create high pixel display thumbnails on Retina devices like iPhone6+? and wasn't the image supposed to be downloaded in 640px instead of 320px (double the amount of pixels)?
The image block doesn't use the Thumbnail type functionality, responsible for the retina stuff. It asks you to provide optional width and height and uses the legacy thumbnailer so no, it won't output Retina images.
The content block, on the other hand, will output a picture element instead of an img element.
This works only if your theme makes use of the function getThemeResponsiveImageMap() which defines image sizes to use for corresponding screen sizes. Have a look at the core Elemental theme, you will find that function in its page_theme.php file
So if that function exists in your theme and it defines different sizes, the content block will output a picture element that will load the right image for the right screen size.
[EDITED] I just checked my first statement and the system will only use normal sized images and not the double sized ones for retina. So it will adapt using settings from the theme to show different size images for different screen sizes but no retina images.
I guess a workaround would be to define images in your theme twice as big as needed and always load them even on non-retina systems.
If the theme doesn't define those sizes, the block will fallback to a normal img element.
This behavior exists in other stuff in C5 but I can't say where exactly.
Last but not least, it would probably be possible to create a template for the Image block to work with the theme's settings the way the content block does.
I hope that helps.
The content block, on the other hand, will output a picture element instead of an img element.
This works only if your theme makes use of the function getThemeResponsiveImageMap() which defines image sizes to use for corresponding screen sizes. Have a look at the core Elemental theme, you will find that function in its page_theme.php file
So if that function exists in your theme and it defines different sizes, the content block will output a picture element that will load the right image for the right screen size.
[EDITED] I just checked my first statement and the system will only use normal sized images and not the double sized ones for retina. So it will adapt using settings from the theme to show different size images for different screen sizes but no retina images.
I guess a workaround would be to define images in your theme twice as big as needed and always load them even on non-retina systems.
If the theme doesn't define those sizes, the block will fallback to a normal img element.
This behavior exists in other stuff in C5 but I can't say where exactly.
Last but not least, it would probably be possible to create a template for the Image block to work with the theme's settings the way the content block does.
I hope that helps.
Thank you for your detailed reply. I will investigate further.
Is this correct?