Retina image support directly in the content field


#1

Hi, is possible insert an image with retina support directly in the content/text field in the admin area?
Any suggestions?
Thanks


#2

Check out these plugins:


You can, of course, also create a custom tag that generates the required sizes.


#3

Thanks for the answer.
The second solution is good but the user must upload two different images in the backend? One normal (@1x) and one retina (@2x)?
Or it’s possible upload a single image and automatically create the retina version?


#4

Oh yes, looks like it. As I said, you can create a custom tag that takes a high-res images and creates the required sizes using the thumb() method.


#5

But in this case I create a thumb image that get in thumbs folder?
How can I use this in the textarea content field with the custom kirbytags “srcset”?

But is not possible drag and drop the image from the sidebar directly into the textarea field and have retina support?
I would like to drag and drop the upload image in the textarea and if the device is retina serve the retina image (@2x) and if not, serve the normal image (@1x).


#6

If you want to drag the image in from the sidebar, you can use a custom image kirbytag, i.e. overwrite the native image tag and make all the changes you need. It does not matter if the image gets stored in the thumbs folder, all you need in the page folder is the original image, the rest is done at runtime when the code is executed.