How Retina Images Are Generated

Any responsive theme needs to create high quality images to ensure proper display on mobile devices or screens of any resolution. iEvent Theme is made retina images ready. Theme automatically generate the @2x image for you if the image you uploaded to start with is large enough to generate the @2x version as well as it’s not displayed in full size.

The logo or any image you upload for any post is automatically converted.

It only makes sense to display a higher quality image if the end user is using a retina display. For our purposes, the best way is with JavaScript. I like to use a script called retina.js by Imulus. It weighs in at only 4kb and adds all the front-end functionality you need to detect a retina display and load the right image

Script Enqueued

iEvent theme comes with the retina.js script enqueued. Any image that can not generate a retina version will be given a data=”no-retina” attribute to prevent the script from trying to locate the file and returning a 404 error.

Any image that is uploaded outside the scope of the theme as part of the Visual composer modules are not made retina ready ,Those images need manual upload of the retina ready images.For Example the Visual Composer “Single Image” module, the theme can’t auto generate the retina version because that specific module is a Visual Composer default module, so you would have to upload your own @2x version

When a image is deleted from the Media library all the extra retina-ready images that were created are trashed as well.