High Resolution Support

[one_headings title=”Theme Documentation” description=”High Resolution Support” description_color=”#000000″ alignment=”align-left” separator=”enable”]

Last updated on August 15, 2015

When your visitors load a page, the theme checks each image on the page to see if there is a high-resolution version of that image on your server. If a high-resolution variant exists, a JavaScript helper script will automatically replaces images on your page with high-resolution variants.

The theme assumes you use Apple’s prescribed high-resolution modifier (@2x) to denote high-resolution image variants on your server.

For example, if you have an image on your page that looks like this:

<img src="/images/my_image.png" alt="" />

The theme will check your server to see if an alternative image exists at this path:

"/images/my_image@2x.png"

Uploading your images

When you upload an image and you want to make it available for high-resolution screens, just upload both your low-resolutions and high-resolution images at the same time and follow the file naming convention described below.