Meaning and how to use "retina & dimensions" on image in design cloud template

[darryl_corp]

Dear team,

I’ve uploaded “creative columns 5” onto my homepage. http://girisunyata.org/

Now I’m tweaking it and would like to change the image.

I see there’s only one image in my library it’s 1280 by 1810 px. However in content editing mode there’s a button (with an eye you can select click) that makes the same image exactly half the size.

So far I’ve been manually uploading 2 versions of images, 1 normal size, one double the size @2x using an external plugin.

But perhaps there’s another way within the Theme itself to have one image and then select the right settings?

Please advice on how this works and what it all means.

Thanks a lot in advance.

Darryl

[prakash_s]

Hello Darryl

Thanks for writing to us.

Retina & Dimensions - This is for Retina support is enabled out the box. Click the Eye to disable the Retina support. Also supports options to set the width and height of the image. For more details, please check this out: https://theme.co/docs/image
https://en.wikipedia.org/wiki/Retina_display

Thanks

[darryl_corp]

Hi there,

Thank you for your reply.

I do know what retina is, that wasn’t the issue.

My question was: how to set the right settings in Pro to have the image retina supported automatically without using the third party plugin (uploading two different sizes of the same image @2x) ?

Example:
I upload the largest version 200 x 100 px and then automatically the image will be scaled to serve retina?

OR:
I have to click and set something with that eye button and insert the right half size? in the case of my example, 100 x 50px for the original uploaded picture of 200x100px.

Sorry, perhaps I wasn’t clear in my previous post.

It’s just unclear to me how to use and what to click. there’s no description with it it just lights up and shows different sizes.

Thanks again.
Darryl

[ruenel]

Hi Darryl,

In our Image documentation, it says:

• Retina & Dimensions - Retina support is enabled out the box. Click the Eye to disable the Retina support. Also supports options to set the width and height of the image.

If the Retina support is enabled, you are expected to upload an image size that is twice the image dimension on the page. For example, if you upload a 200x100 pixel image, only 100 x 50 pixels will be displayed. You might need to upload a 400 x 200 image dimension so that the displayed image on the page is not small enough yet supports Retina.

Hope this helps.

[darryl_corp]

thanks a lot, that makes it a lot clearer now.

And apologise for not understanding earlier, I’m a DIY

[tristup]

Hi Darryl,

It’s my pleasure to help you with this.

Thanks