OpenCart Community

Hi there,

Just got myself a shiny new retina display MacBook. However... when visiting any site (including my Opencart ones) that isn't retina-enabled, jpg and png images are slightly blurred. This is roughly the same for Safari, Firefox and Chrome. Everything else is laser-sharp, but images are rendered pretty poorly. The same applies on the new iPhone etc. When visiting a site that has retina images, it looks amazing.

Can anyone recommend a good extension for this? I can't find any that have enough reviews etc to justify a purchase... Just looking there is an opensource retina javascript so I might try that (and make a vqmod to go with it).

The 2.0 demo doesn't seem to support this from a quick glance, although I may have missed something. I'm guessing retina displays will become more and more prevalent, so it would be good to have support for this, and make the new version even snazzier...

In order for images to be displayed properly on retina, they have to be retina-ready. If you have a website and want your images not to be blurry, you must upload the new images, the same but double the size. Ex: 200 x 100 would become 400 x 200.
Also you should use a responsive theme.

thanks for the reply Andrei.

That sounds good. Opencart normally limits the dimensions/size of an upload, so I will probably have to do this via ftp instead. I might try the javascript route anyway otherwise non-retina people will have to download the larger images each time. The one I found recognises if the screen is retina then finds the x2 image.

yes, I guess that is the right solution in your case. good luck!

This is actually not the right solution. As far as I know opencart resizes images for category & product view (and maybe others). The images it will produce are not retina compatible and you can not do anything about it without extensions/custom coding.

So is there any other solution? Letting opencart resize image to the double size or leave the resizing out in the first place could cause slower loading on non-retina devices.